This page is part of a static HTML representation of the TiddlyWiki at http://tiddlywiki.com/

"A Thesis Notebook" by Alberto Molina

15 months ago

A thesis notebook based on TiddlyWiki.

This is an example of a thesis notebook powered by TiddlyWiki 5.0.8-beta.

TiddlyWiki is a great piece of software created by Jeremy Ruston. It allows you, among other things, to take notes, organize ideas, store information, and display all your stuff the way you want. It is an incredibly flexible tool you can adapt to fit almost all your needs.

This TiddlyWiki has been customized to serve as a philosophy notebook centered around authors, books and papers, concepts and theories, and personal notes. I use it along with Zotero, which is a dedicated bibliography software. Both are free, open source projects. TiddlyWiki can be downloaded at http://tiddlywiki.com.

"BJHacks" by buggyj

3 months ago

buggyj has created several useful plugins, including a WYSIWYG HTML editor, a configurable calendar and tag lists with draggable ordering.

"BrainTest - tools for a digital brain" by Danielo Rodriguez

3 months ago

A collection of customisations and macros from Danielo Rodriguez.

This is my personal tiddlywiki file for testing.

Here I will post the tools and Macros that I develop for this awesome tool. That way, all the help the comunity gave me can came back to the comunity again.

"Creating a baby journal with TiddlyWiki 5" from A Penguin in Redmond

4 months ago

A guide to creating a baby journal with TiddlyWiki.

Keeping a journal about your baby is fun. It allows you to keep track of those events in your baby's life and development that are most important to you, and to tell them in your own words. [...]

There are plenty of online services that can help to keep such a diary, but you need to have an internet connection to access them, and you have to trust them to keep your data safe.

"Install and run TiddlyWiki on a CentOS 6 VPS using Nginx" from RoseHosting

3 months ago

A step by step guide to running TiddlyWiki on a CentOS Virtual Private Server.

In this tutorial we will guide you through the steps of installing and running TiddlyWiki on a CentOS 6 VPS.

We will also install and configure Nginx as a reverse proxy, so you can run TiddlyWiki behind Nginx.

"Shining Ark Using TiddlyWiki" by Helu

9 months ago

A gamers guide to using TiddlyWiki.

I’ve been using TiddlyWiki for this game mainly to record the monsters’ locations and the items that they drop. This is so that when I need a certain item to upgrade/create weapons, I can quickly look it up; which monsters drop it and which quests have those monsters.

As I play the game, as I encounter new information, I just input them into my Shining Ark TiddlyWiki. It’s like I’m building a wiki from scratch. The reason why I don’t just use online wikis is that 1) it’s too easy to get spoiled and 2) sometimes online wikis provide too much information (who cares about the non-gameplay related descriptions that can be found in the game, etc).

"TiddlyWiki 5 im Betatest" by besim

5 months ago

Reaction to TiddlyWiki5 from the translator of the German edition of TiddlyWikiClassic.

There is little software that can still inspire me so even after years, as on the first day. This includes TiddlyWiki, the "pocket-wiki". The latter is because the Wiki completely fits into an HTML file, and this HTML file brings everything - JavaScript program logic, CSS appearance and the entire Wiki content as stored records. So a TiddlyWiki file is then sometimes happy times some megabytes in size, but just has the unbeatable advantage that it works just as fast file created locally in a variety of browsers.

(Translation from German by Google Translate)

"TiddlyWiki 5 vis.js plug-in" by emkay

3 months ago

A beautifully presented timeline widget using vis.js (http://visjs.org).

Source: https://github.com/emkayonline/tw5visjs

This plug-in allows TW5 to display tiddlers using the vis.js graphical timeline and graph widgets.

This plug-in has been testing on OS X with Safari, Chrome and Firefox, but should work under all operating systems and browser supported by TW5 and vis.js.

Also, the plug-in has been designed to work off-line, enabling it to be used without a wireless connection on an iPad/iPhone using TWEdit

"TiddlyWiki Notes" by James Anderson

2 months ago

Notes and tips by a developer working on writing TiddlyWiki plugins – including TWExe, a widget for running Windows scripts and executables.

"TiddlyWiki Posts" by Jeffrey Kishner

4 months ago

A collection of articles covering integration with Fargo, Font Awesome and Google Calendar, and tips for managing task lists.

I have become a regular user of TiddlyWiki and have become so accustomed to using Font Awesome icons in Fargo that I wanted to incorporate the icons into my wikis as well.

"TiddlyWiki 舞" by Bram Chen

3 months ago

A translation of the tiddlywiki.com documentation from Bram Chen, TiddlyWiki's Chinese translator.

"TiddlyWiki5 Coding" by Chris Hunt

3 months ago

Chris Hunt's detailed developer tutorials for getting started with writing widgets for TiddlyWiki.

These pages document aspects TiddlyWiki5 programming, sharing "lessons learned" to help developers to get started with TiddlyWiki5 customization and extension.

There are currently two articles in this wiki:

  • A Simple Widget
  • A More Complex Widget

"TiddlyWiki5 Playground" by Ton Gerner

3 months ago

Huge collection of customisations and tweaks from Ton Gerner.

I am a longtime user of TiddlyWiki Classic and still use it daily since you can't do everything in TiddlyWiki 5 (yet) ;)

I started experimenting with TW5 at the end of September 2013 (alpha10). Since I missed a few things in the layout I got used to in TiddlyWiki Classic 1, I started with modifying the layout of TW5. To share my knowledge, I made a few guides about these 'modifications'. The guides started as a non-linear personal web notebook (yeah, the subtitle of TiddlyWiki!). I started experimenting with layout things and used TW5 to document my experiments.

"TW5 Magick" by Stephan Hradek

3 months ago

Stephan Hradek's growing catalogue of tips and tutorials. Stephan has also developed several plugins and macros that you can find at http://tiddlystuff.tiddlyspot.com/.

Some things in TiddlyWiki seem like Magic. As my preferred nick is Skeeve, I felt that TW5 Magick is a proper name for this collection of some of the "magic" tricks one can do with TiddlyWiki.

"TW5 Mall" by David Gifford

3 months ago

Dave Gifford's growing catalogue of tips and tutorials.

TiddlyWiki 5 is a great tool for note-taking, bookmarking, blogging, organizing to do lists, writing books, and more. But many of the things that can be done in TiddlyWiki 5 are often hidden to the new user, either because the user doesn't know about it or because the user doesn't know how to do it. TW5 mall is a modest catalog of hacks where you can discover new tricks in TiddlyWiki 5 and also find out in layman's terms how to implement them.

"TW5 Tribal Knowledge" from Scott Kingery

3 months ago

Tips and guides for using TiddlyWiki.

I never used Node.js until a couple weeks ago when I wanted to try a TW5 installation on Node and expand my knowledge a bit. I figured someone else may be in the same boat so I wrote it all down

"TWeb.at" by Mario Pietsch

2 months ago

A collection of TiddlyWiki resources from Mario Pietsch, with a focus on cloud deployments. Mario also maintains the German translation of TiddlyWiki.

My name is Mario Pietsch from Austria. I'm living near Salzburg.

This page, will be the portal to my TiddlyWiki, TiddlyWeb related content.

"Wills Q&D gTD" by Matabele

50 days ago

Matabele's stylish and clean system for personal task management.

This is my work in progress version of TW5, incorporating various features and ideas as and when they intrigue me. To grab any feature you may wish to try, drag the listed tiddlers across to the dropzone of an empty TiddlyWiki 5.0.10-beta

"デザイン刷新。次の25年を目指すTiddlyWiki" by Moongift

7 months ago

An introduction to TiddlyWiki in Japanese.

1 John Notebase

6 months ago

A study notebook for the Bible.

Acknowledgements

4 months ago

TiddlyWiki5 wouldn't be possible without the ongoing support of the TiddlyWiki user and developer community. Their attention and feedback has made it possible to gain an understanding of what is wanted from the product, and their passion for it has taught me that it is worth the investment that I am making.

TiddlyWiki5 stands on the shoulders of giants by incorporating code from these fine OpenSource projects:

Adding a Twitter Follow button

5 months ago

Here's a macro that provides a Twitter Follow button for a particular username:

\define twitterFollowButton(username)
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//platform.twitter.com/widgets/follow_button.html?screen_name=$username$"  style="width:300px; height:20px;"></iframe>
\end

The only change from the version published at https://dev.twitter.com/docs/follow-button is that new lines have been removed.

Note that the src URL is given without a protocol (ie "http" or "https"). It's done this way so that it works on sites whether they are hosted on a HTTP or HTTPS domain. If you want the Twitter button to work while using a TiddlyWiki offline on a "file://" URL, then you'll need to manually add the protocol. For example:

<iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://platform.twitter.com/widgets/follow_button.html?screen_name=jermolene"  style="width:300px; height:20px;"></iframe>

AlertMechanism

4 months ago

Alerts are displayed as yellow boxes overlaying the main TiddlyWiki window. Each one corresponds to a tiddler with the tag $:/tags/Alert. Clicking the delete icon on an alert deletes the corresponding tiddler.

Here's a demo .

Alert tiddlers should have the following fields:

FieldDescription
titleBy default, alert titles have the prefix $:/temp/alerts/
textThe text of the alert message
modifiedDate of the alert (used for ordering the alerts on screen)
componentComponent name associated with the alert
tagsMust include $:/tags/Alert

AllTiddlers

3 months ago

Current tiddlers:

"A Thesis Notebook" by Alberto Molina
"BJHacks" by buggyj
"BrainTest - tools for a digital brain" by Danielo Rodriguez
"Creating a baby journal with TiddlyWiki 5" from A Penguin in Redmond
"Install and run TiddlyWiki on a CentOS 6 VPS using Nginx" from RoseHosting
"Shining Ark Using TiddlyWiki" by Helu
"TiddlyWiki 5 im Betatest" by besim
"TiddlyWiki 5 vis.js plug-in" by emkay
"TiddlyWiki Notes" by James Anderson
"TiddlyWiki Posts" by Jeffrey Kishner
"TiddlyWiki 舞" by Bram Chen
"TiddlyWiki5 Coding" by Chris Hunt
"TiddlyWiki5 Playground" by Ton Gerner
"TW5 Magick" by Stephan Hradek
"TW5 Mall" by David Gifford
"TW5 Tribal Knowledge" from Scott Kingery
"TWeb.at" by Mario Pietsch
"Wills Q&D gTD" by Matabele
"デザイン刷新。次の25年を目指すTiddlyWiki" by Moongift
1 John Notebase
Acknowledgements
Adding a Twitter Follow button
AlertMechanism
AllTiddlers
Articles
AutoSave
Block Quotes in WikiText
BootMechanism
BrowseWidget
BT
BuildCommand
Building TiddlyWikiClassic
ButtonWidget
CamelCase
ChangeCountMacro
Changes to filters in 5.0.9-beta
CheckboxWidget
ClearPasswordCommand
Code Blocks in WikiText
ColourPalettes
command
Community
Compose ballad
concepts
ContentType
Contributing
ContributingTemplate
CountWidget
Creating SubStories
CurrentTiddler
Dashes in WikiText
DataTiddlers
DateFormat
definitions
Definitions in WikiText
demo
deserializers
dev
Developing plugins using Node.js and GitHub
Docs
done
Download
DraftMechanism
DropzoneWidget
EditBitmapWidget
Editing Tiddlers with Emacs
EditTextWidget
EditWidget
EncryptionMechanism
EncryptWidget
Environment Variables on Node.js
Examples
ExternalImages
faq
features
Features
FederatialLimited
FieldManglerWidget
FieldsWidget
FilterOperator: after
FilterOperator: all
FilterOperator: backlinks
FilterOperator: before
FilterOperator: bf
FilterOperator: butfirst
FilterOperator: butlast
FilterOperator: commands
FilterOperator: each
FilterOperator: eachday
FilterOperator: field
FilterOperator: first
FilterOperator: get
FilterOperator: has
FilterOperator: indexes
FilterOperator: is
FilterOperator: last
FilterOperator: limit
FilterOperator: links
FilterOperator: list
FilterOperator: listed
FilterOperator: modules
FilterOperator: moduletypes
FilterOperator: next
FilterOperator: nsort
FilterOperator: nsortcs
FilterOperator: nth
FilterOperator: plugintiddlers
FilterOperator: prefix
FilterOperator: previous
FilterOperator: removeprefix
FilterOperator: rest
FilterOperator: reverse
FilterOperator: sameday
FilterOperator: search
FilterOperator: shadowsource
FilterOperator: sort
FilterOperator: sortcs
FilterOperator: tag
FilterOperator: tagging
FilterOperator: tags
FilterOperator: title
FilterOperator: untagged
FilterOperators
Formatting in WikiText
Freedom Bits - preserve your rights to free speech and association
Future of TiddlyWiki
Generating Static Sites with TiddlyWiki
Get the Ring
Getting Started Video
GettingStarted
Go to Mordor
GoogleChromeTips
GridDemo_A_1
GridDemo_A_2
GridDemo_A_3
GridDemo_B_1
GridDemo_B_2
GridDemo_B_3
GridDemo_C_1
GridDemo_C_2
GridDemo_C_3
GridWidget
Hard Linebreaks in WikiText
Headings in WikiText
HelloThere
HelpCommand
HelpingTiddlyWiki
HistoryMechanism
Horizontal Rules in WikiText
How to build a TiddlyWiki5 from individual tiddlers
How to create a translation for TiddlyWiki
How to create plugins in the browser
howto
HTML in WikiText
Images in WikiText
ImageWidget
ImportTiddlers
ImportVariablesWidget
InitCommand
Installing TiddlyWiki on Node.js
internals
Introducing TiddlyDesktop Video
introduction
Introduction to Filters
JavaScript
JavaScript Macros
JeremyRuston
Jermolene
KeyboardShortcuts
KeyboardWidget
Kill the Dragon
Latest
LazyLoading
LazyLoadingMechanism
LinkCatcherWidget
Linking in WikiText
LinkWidget
ListField
Lists in WikiText
ListWidget
LoadCommand
MacroCallWidget
macros
Macros
Macros in WikiText
Make the beds
MakeDataUriMacro
Making curved text with SVG
MathJax Plugin by Martin Kantor
MathML
mechanism
Modules
ModuleType
Motovun Jack.jpg
Motovun Jack.pdf
Motovun Jack.svg
MultiTiddlerFiles
Naming of System Tiddlers
NavigatorWidget
node-webkit
Node.js
Notes for upgrading to 5.0.11-beta
Notes for upgrading to 5.0.8-beta
OpenSource
Osmosoft
OutputCommand
OXTWIG
packge.json for node-webkit
Paragraphs in WikiText
ParsingMechanism
PasswordCommand
PasswordWidget
PermaLinks
Philosophy of Tiddlers
PluginMechanism
Plugins
PopupMechanism
Preserving open tiddlers at startup
QualifyMacro
Quine
RadioWidget
ReadMe
Release 5.0.0-alpha.11
Release 5.0.0-alpha.12
Release 5.0.0-alpha.13
Release 5.0.0-alpha.14
Release 5.0.0-alpha.15
Release 5.0.0-alpha.16
Release 5.0.0-alpha.17
Release 5.0.1-alpha
Release 5.0.10-beta
Release 5.0.11-beta
Release 5.0.12-beta
Release 5.0.13-beta
Release 5.0.2-beta
Release 5.0.3-beta
Release 5.0.4-beta
Release 5.0.5-beta
Release 5.0.6-beta
Release 5.0.7-beta
Release 5.0.8-beta
Release 5.0.9-beta
ReleaseHistory
releasenote
Releasing a new version of TiddlyWiki5
RenderingMechanism
RenderTiddlerCommand
RenderTiddlersCommand
ReportingBugs
Resources
RevealWidget
RoadMap
SafeMode
SampleAlert
SampleNotification
sampletag1
sampletag2
SampleTiddlerFirst
SampleTiddlerSecond
SampleTiddlerThird
SampleWizard
SampleWizard2
SaveTiddlerCommand
SaveTiddlersCommand
Saving on a PHP Server
Saving on Android
Saving on InternetExplorer
Saving on iPad/iPhone
Saving on TiddlySpot
Saving with Encryption
Saving with the HTML5 fallback saver
Saving with TiddlyFox
Saving with TiddlyFox on Android
Saving with TiddlyIE
Scalability
Scripts for TiddlyWiki on Node.js
ScrollableWidget
Searching
SelectWidget
Server Architecture.svg
ServerCommand
SetFieldCommand
Setting a favicon
SetVariableWidget
SetWidget
ShadowTiddlers
Sharing a TiddlyWiki on Dropbox
SingleFileApplication
SinglePageApplication
Startup Modules.svg
StartupMechanism
StateMechanism
Structuring TiddlyWiki
Styles and Classes in WikiText
SyncAdaptorModules
SystemTags
SystemTiddlers
TableOfContents
Tables in WikiText
TabsMacro
TalkyTalky
task
TaskManagementExample
TemplateTiddlers
TestingMechanism
TextReference
TextWidget
The First Rule of Using TiddlyWiki
Tiddler Fishes.svg
TiddlerFields
TiddlerFiles
TiddlerFilter Formal Grammar
TiddlerFilters
TiddlerLinks
Tiddlers
TiddlerTags
TiddlerWidget
TiddlyDesktop
TiddlyFox
TiddlyIE
TiddlySpace
TiddlyWeb
TiddlyWiki
TiddlyWiki Architecture
TiddlyWiki Architecture.svg
TiddlyWiki Classic.png
TiddlyWiki Coding Style Guidelines
TiddlyWiki for Developers
TiddlyWiki Hangouts
TiddlyWiki in the Sky for TiddlyWeb
TiddlyWiki on Firefox for Android Video
TiddlyWiki on node-webkit
TiddlyWiki on Node.js
TiddlyWiki2ReadMe
TiddlyWiki5
TiddlyWiki5 Development Environment
TiddlyWiki5 Versioning
TiddlyWikiClassic
TiddlyWikiFolders
tips
TitlesPolicy
TranscludeWidget
Transclusion in WikiText
TranslationMechanism
Typed Blocks in WikiText
Upgrading
Upgrading TiddlyWiki on Node.js
Using a custom path prefix with the client-server edition
Using Stylesheets
Using TiddlyWiki for GitHub Pages project documentation
Using TiddlyWiki on Node.js
Using TiddlyWiki on TiddlyDesktop
UsingSVG
VerboseCommand
VersionCommand
VersionMacro
video
Video Tutorials
ViewWidget
widget
WidgetMessage: tw-cancel-tiddler
WidgetMessage: tw-clear-password
WidgetMessage: tw-close-all-tiddlers
WidgetMessage: tw-close-other-tiddlers
WidgetMessage: tw-close-tiddler
WidgetMessage: tw-delete-tiddler
WidgetMessage: tw-edit-tiddler
WidgetMessage: tw-home
WidgetMessage: tw-import-tiddlers
WidgetMessage: tw-navigate
WidgetMessage: tw-new-tiddler
WidgetMessage: tw-save-tiddler
WidgetMessage: tw-set-password
WidgetMessages
WidgetModules
Widgets in WikiText
Wiki
WikiRuleModules
WikiText
Windows HTA Hack
Working with the TiddlyWiki5 repository

Articles

3 months ago

Submit new entries to this collection of articles via GitHub, Twitter or by posting in the TiddlyWiki Groups.

AutoSave

4 months ago

If there is a SaverModule available that supports it, TiddlyWiki will automatically trigger a save of the current document on clicking tick or delete when editing a tiddler.

You should see a yellow notification at the top right of the window to confirm that an automatic save has taken place.

Automatic saving can be enabled or disabled through the Saving tab of the control panel. Behind the scenes, it is controlled through the configuration tiddler $:/config/AutoSave, which must have the value yes to enable automatic saving.

Block Quotes in WikiText

6 months ago

There are two ways to produce HTML block quotes in TiddlyWiki5, one for content spread across multiple lines, and one for single line content.

Multi-line Block Quotes

The syntax for multi-line block quotes is:

Citation

A citation can be added to the quote like this:

CSS Classes

CSS classes can be added to a block quote:

Single-line Block Quotes

The single-line syntax for block quotes is actually an extension of the syntax for Lists in WikiText. For example:

You can also nest quotes like this:

> A top quote
>> A subquote
> Another top quote

Which renders as:

A top quote

A subquote

Another top quote

You can also mix block quotes with other list items. For example:

BootMechanism

52 days ago

Introduction

At its heart, TiddlyWiki5 is a relatively small boot kernel that runs either under Node.js or in the browser with all other functionality added via dynamically loaded modules.

The kernel boots just enough of the TiddlyWiki environment to allow it to load and execute module tiddlers. The module system is compatible with CommonJS and Node.js.

There are many different types of module: parsers, deserializers, widgets etc. It goes much further than you might expect. For example, individual tiddler fields are modules, too: there's a module that knows how to handle the tags field, and another that knows how to handle the special behaviour of the modified and created fields. Some plugin modules have further sub-plugins: the wikitext parser, for instance, accepts parsing rules as individual plugin modules.

Plugins

In TiddlyWiki5, Plugins are bundles of tiddlers that are distributed and managed as one; Modules are JavaScript tiddlers with a module type identifying when and how they should be executed.

The tiddler $:/boot/boot.js is a barebones TiddlyWiki kernel that is just sufficient to load the core plugin modules and trigger a startup module to load up the rest of the application.

The boot kernel includes:

  • Several short shared utility functions
  • A handful of methods implementing the module mechanism
  • The $tw.Tiddler class (and field definition plugins)
  • The $tw.Wiki class (and tiddler deserialization methods)
  • Code for the browser to load tiddlers from the HTML DOM
  • Code for the server to load tiddlers from the file system

Each module is an ordinary CommonJS module, using the require() function to access other modules and the exports global to return JavaScript values. The boot kernel smooths over the differences between Node.js and the browser, allowing the same plugin modules to execute in both environments.

In the browser, core/boot.js is packed into a template HTML file that contains the following elements in order:

  • Ordinary and system tiddlers, packed as HTML <DIV> elements
  • core/bootprefix.js, containing a few lines to set up the plugin environment
  • Optional JavaScript modules, packed as HTML <SCRIPT> blocks
  • core/boot.js, containing the boot kernel

On the server, core/boot.js is executed directly. It uses the Node.js local file API to load plugins directly from the file system in the core/modules directory. The code loading is performed synchronously for brevity (and because the system is in any case inherently blocked until plugins are loaded).

The boot process sets up the $tw global variable that is used to store all the state data of the system.

At the end of the boot process the StartupMechanism schedules the execution of startup modules to bring up the rest of TiddlyWiki.

BrowseWidget

7 months ago

Introduction

The browse widget displays an HTML file browser button that allows the user to choose one or more files to import. It sends a WidgetMessage: tw-import-tiddlers carrying a JSON representation of the tiddlers imported from the files up through its parents. This message usually trapped by the NavigatorWidget which adds the tiddlers to the store and updates the story to display them.

Content and Attributes

The browse widget has no attributes, and ignores any contained content.

BT

7 months ago

BT (née British Telecom) is the UK's largest telecommunications company. In 2007, Osmosoft was acquired by BT. JeremyRuston subsequently left BT in 2011.

BuildCommand

57 days ago

Build the specified build targets for the current wiki. If no build targets are specified then all available targets will be built.

--build <target> [<target> ...]

Build targets are defined in the tiddlywiki.info file of a wiki folder.

See TiddlyWikiFolders for details of defining build targets.

Building TiddlyWikiClassic

6 months ago

TiddlyWiki5 can be used to build older 2.x.x versions of TiddlyWikiClassic from their constituent components. Doing so involves these features:

  • The tiddlywiki/classictools plugin, containing a deserializer module which allows tiddlers to be loaded from TiddlyWiki 2.x.x .recipe files
  • The stripcomments format for the ViewWidget, which strips single line JavaScript comments starting //#
  • The stripTitlePrefix='yes' attribute of the FieldsWidget, which removes prefixes wrapped in curly braces from the title attribute
    • For example, {tiddler}HelloThere would be transformed to HelloThere

Usage

TiddlyWikiClassic is built from the command line by running TiddlyWiki on Node.js. A typical usage would be:

node ../../tiddlywiki.js \
	--verbose \
	--load <path_to_recipe_file> \
	--rendertiddler $:/core/templates/tiddlywiki2.template.html <path_to_write_index_file> text/plain \
	|| exit 1

ButtonWidget

7 days ago

Introduction

The button widget displays an HTML <button> element that can perform a combination of optional actions when clicked:

  • Navigate to a specified tiddler
  • Dispatch a user defined widget message
  • Trigger a user defined popup
  • Assign new text to a specified tiddler

Content and Attributes

The content of the <$button> widget is displayed within the button.

AttributeDescription
toThe title of the tiddler to navigate to
messageThe name of the widget message to send when the button is clicked
paramThe optional parameter to the message
setA TextReference to which a new value will be assigned
setToThe new value to assign to the TextReference identified in the set attribute
popupTitle of a state tiddler for a popup that is toggled when the button is clicked
aria-labelOptional Accessibility label
titleOptional tooltip
classAn optional CSS class name to be assigned to the HTML element
styleAn optional CSS style attribute to be assigned to the HTML element
selectedClassAn optional additional CSS class to be assigned if the popup is triggered or the tiddler specified in set already has the value specified in setTo
defaultDefault value if set tiddler is missing for testing against setTo to determine selectedClass

CamelCase

9 months ago

CamelCase is formed by taking a phrase, capitalising each initial letter and smashing them together to form a portmanteau word. Most wikis use CamelCase to signal phrases that should be automatically linked.

ChangeCountMacro

5 months ago

The changecount macro returns a counter maintained by the TiddlyWiki core that tracks the number of modifications made to each tiddler. The changecount macro always applies to the tiddler named in the currentTiddler variable.

For example:

<<changecount>>

Displays as:

0

Note how the changecount increases every time this tiddler is modified.

Changes to filters in 5.0.9-beta

2 months ago

Introduction

This release resolves a number of inconsistencies with the way that filters are handled. The changes mean that existing filters may need to be updated - particularly those that must deal with missing or shadow tiddlers.

Changes to is and addition of all

Most filter operators act by choosing some or all of their source titles to pass through or re-order. Those that add new entries that are not drawn from the source list are referred to as selectors. Prior to 5.0.9-beta, a few filter operators were inconsistent in whether they filtered from the source list or selected new entries into it.

The specific changes are:

  • The is operator now always strictly filters from the currently selected list of tiddlers
  • The new all operator acts as a selector by replacing the current list with a combination of tiddlers from specific sources:
    • current for the current tiddler
    • missing for all missing tiddlers
    • orphans for all orphan tiddlers
    • shadows for all shadow tiddlers
    • tiddlers for all non-shadow tiddlers (including both system and non-system tiddlers)

The sources for the all operator can be combined with the + character. For example, [all[shadows+tiddlers]] returns all shadow tiddlers and all ordinary tiddlers.

Previously, it was common to have [is[shadow]] at the start of a filter string to select all the shadow tiddlers. In 5.0.9 and above, this will not return all the shadow tiddlers, but instead just those ordinary tiddlers that are also shadow tiddlers (by virtue of having overridden one). The resolution is to use the new all operator. For example, consider this filter from 5.0.8:

[is[shadow]!has[draft.of]tag[$:/tags/AdvancedSearch]] [!is[shadow]!has[draft.of]tag[$:/tags/AdvancedSearch]] +[tag[$:/tags/AdvancedSearch]]

In 5.0.9, that filter has been changed to:

[all[shadows+tiddlers]tag[$:/tags/AdvancedSearch]!has[draft.of]]

Note how the all operator allows operations to be performed on tiddlers from combinations of sources.

Changes to [is[current]]

One result of the changes is that [is[current]] now strictly filters from the source tiddlers; so, if the current tiddler is a missing tiddler not in the source list, then [is[current]] will return an empty list.

The solution is generally to use [all[current]] instead. It doesn't read as well, but has the required behaviour of returning just the current tiddler, regardless of whether it is in the source tiddlers.

Changes to title and field

There are minor changes to the way that the title and field operators work.

The title operator is a selector: it returns the specified title regardless of whether it is in the current source. title is used as the default operator if none is specified

The field operator is a filter: it only returns a subset of the source tiddlers. field is used as the default operator if the supplied operator is not defined (the supplied operator is passed as the suffix to the field operator, so [description[Missing]] is equivalent to [field:description[Missing]]).

CheckboxWidget

7 months ago

Introduction

The checkbox widget displays an HTML <input type="checkbox"> element that is dynamically bound to the presence or absence of a specified tag on a specified tiddler.

Content and Attributes

The content of the <$checkbox> widget is displayed within an HTML <label> element immediately after the checkbox itself. This means that clicking on the content will toggle the checkbox.

AttributeDescription
tiddlerTitle of the tiddler to manipulate (defaults to the WidgetVariable: currentTiddler)
tagThe name of the tag to which the checkbox should be bound

ClearPasswordCommand

Clear the password for subsequent crypto operations

--clearpassword

Code Blocks in WikiText

4 months ago

You can use triple backticks ``` to mark code blocks:

```
This will be monospaced
```

The three backticks need to be at the start of the line and immediately followed by a newline, otherwise they won't be interpreted correctly.

Renders as:

This will be monospaced

Note that some keyboard layouts treat the backtick as a dead key, making it hard to type. The trick is to type three backticks followed by a space. Alternatively, type all six backticks in one go, then a space, and then move the cursor back three characters to type or paste the content.

ColourPalettes

4 months ago

Colour palettes bind logical colour names (such as page-background) to actual CSS colours (such as #fe0).

Entire colour palettes are stored in a single data tiddler.

The title of the tiddler containing the current colour palette is identified by the tiddler $:/palette.

To retrieve a named colour from the current palette you can use the colour macro:

<<colour page-background>>

The colour macro is defined like this:

\define colour(name)
<$transclude tiddler={{$:/palette}} index="$name$"/>
\end

By convention, each theme provides a default colour palette in the tiddler $:/config/DefaultPalette tiddler. Thus, setting the tiddler $:/theme to the string $:/config/DefaultPalette will revert to the palette packaged with the current theme (as long as it hasn't been redefined, since it is a shadow tiddler).

Palette tiddlers should have the following fields:

FieldDescription
titleAny title can be used, typically a system title starting with "$:/"
typeapplication/x-tiddler-dictionary to identify this tiddler as a data tiddler
tags$:/tags/Palette to identify this tiddler as a palette
descriptionDescription to be displayed in palette browser
textColour definitions (see below)

The text of a palette tiddler consists of name value pairs like this:

foreground: #000
background: #fff

command

6 months ago

When run under Node.js, TiddlyWiki supports a command line interface with these built-in commands.

Community

3 months ago

TiddlyWiki is made much more useful by its vibrant community of users and OpenSource developers.

Community Forums

The TiddlyWiki discussion groups are mailing lists for talking about TiddlyWiki: requests for help, announcements of new releases and plugins, debating new features, or just sharing experiences.

New releases of TiddlyWiki, TiddlyDesktop and TiddlyFox are announced via the discussion groups and Twitter.

Local TiddlyWiki Interest Groups

Local meetings of TiddlyWiki enthusiasts around the world:

  • OXTWIG, the Oxford TiddlyWiki Interest Group meets monthly in Oxford, UK to share experiences of using TiddlyWiki

If you are a TiddlyWiki enthusiast please consider starting a local TWIG in your area, it's a great way to spread the word about using TiddlyWiki

Links

Compose ballad

9 months ago

This is a sample task for the TaskManagementExample

concepts

9 months ago

These are the concepts underlying TiddlyWiki. Understanding how these ideas fit together is the key to getting the most from TiddlyWiki.

ContentType

9 months ago

Used in Internet protocols to indicate the type that should be used to interpret the content of a web resource.

Under TiddlyWiki5, the type field is gives the content type to apply to the main text field.

Contributing

16 days ago

TiddlyWiki5 welcomes contributions to its code and documentation via GitHub. Please take a moment to read these notes to help make the process as smooth as possible.

Coding Style

Code contributions should follow the TiddlyWiki Coding Style Guidelines.

GitHub Issues

See ReportingBugs for information about how TiddlyWiki handles bug reports.

Contributor License Agreement

Like other OpenSource projects, TiddlyWiki5 needs a signed contributor license agreement from individual contributors. This is a legal agreement that allows contributors to assert that they own the copyright of their contribution, and that they agree to license it to the UnaMesa Association (the legal entity that owns TiddlyWiki on behalf of the community).

This is a first pass at a CLA for TiddlyWiki. Please let us know if we missed something important. If we do have to make essential changes to the CLA, there is a possibility that all contributors will need to sign it again

How to sign the CLA

Create a GitHub pull request to add your name to cla-individual.md or cla-entity.md, with the date in the format (YYYY/MM/DD).

eg: Jeremy Ruston, @Jermolene, 2011/11/22

Thank you!

Attribution

The CLA documents used for this project were created using Harmony Project Templates. "HA-CLA-I-LIST Version 1.0" for "CLA-individual" and "HA-CLA-E-LIST Version 1.0" for "CLA-entity"

ContributingTemplate

9 months ago

Contributing to TiddlyWiki5

TiddlyWiki5 welcomes contributions to its code and documentation via GitHub. Please take a moment to read these notes to help make the process as smooth as possible.

Coding Style

Code contributions should follow the TiddlyWiki Coding Style Guidelines.

GitHub Issues

See ReportingBugs for information about how TiddlyWiki handles bug reports.

Contributor License Agreement

Like other OpenSource projects, TiddlyWiki5 needs a signed contributor license agreement from individual contributors. This is a legal agreement that allows contributors to assert that they own the copyright of their contribution, and that they agree to license it to the UnaMesa Association (the legal entity that owns TiddlyWiki on behalf of the community).

This is a first pass at a CLA for TiddlyWiki. Please let us know if we missed something important. If we do have to make essential changes to the CLA, there is a possibility that all contributors will need to sign it again

How to sign the CLA

Create a GitHub pull request to add your name to cla-individual.md or cla-entity.md, with the date in the format (YYYY/MM/DD).

eg: Jeremy Ruston, @Jermolene, 2011/11/22

Thank you!

Attribution

The CLA documents used for this project were created using Harmony Project Templates. "HA-CLA-I-LIST Version 1.0" for "CLA-individual" and "HA-CLA-E-LIST Version 1.0" for "CLA-entity"

This file was automatically generated by TiddlyWiki5

CountWidget

7 months ago

Introduction

The count widget displays the number of matches to a specified filter expression.

Content and Attributes

The content of the <$count> widget is ignored.

AttributeDescription
filterThe filter expression to count

Creating SubStories

4 months ago

This example shows how to create a sub-story within a tiddler that is independent of the main story.

Here's the code:

<$navigator story="MySubStoryList" history="MySubHistoryList">

Click this link to get started: HelloThere

<$list filter="[list[MySubStoryList]]" history="MySubHistoryList">
<div>

! <$button message="tw-close-tiddler" class="btn-invisible">{{$:/core/images/close-button}}</$button> <$view field="title"/>

<$transclude/>
</div>
</$list>

</$navigator>

Note how you can open the HelloThere tiddler in the substory by clicking on the link below. Links within the substory open within the substory, and not in the main story.

Click this link to get started: HelloThere

CurrentTiddler

5 months ago

The CurrentTiddler is the current tiddler during WikiText processing. A context tiddler is set by the TiddlerWidget. It allows you to write references like <$view field="title" format="link"/> in TemplateTiddlers without explicitly specifying the tiddler that it applies to.

Dashes in WikiText

6 months ago

You can create an n-dash with a double hyphen -- and an m-dash with a triple hyphen ---. For example – this is an example — and so is this

DataTiddlers

9 months ago

Data tiddlers provide a way to access blocks of JSON data within the text field of a tiddler.

The implementation of data tiddlers is preliminary, with some intentional limitations.

Data tiddler format

A native data tiddler must have:

  • The ContentType field type set to application/json
  • Valid JSON data in the text field

For example, the history list tiddler is a data tiddler.

Other tiddler types with alternative formats can also be parsed to yield a block of data that behaves like a data tiddler.

Tiddler dictionary format

The tiddler dictionary format is an alternative syntax for data tiddlers:

  • The ContentType field type is set to application/x-tiddler-dictionary
  • The text field consists of one or more lines of the form <name>:<value>

For example, the metrics of the Vanilla theme are a tiddler dictionary.

Accessing data within data tiddlers

Currently, it is only possible to access the top level properties of the data using TextReference syntax.

For example, given a application/json tiddler containing:

{"a":"one","b":"two","c":"three"}

Or the equivalent tiddler dictionary of type application/x-tiddler-dictionary:

a:one
b:two
c:three

With either of those definitions {{TiddlerTitle##b}} would have the value two.

DateFormat

2 months ago

The ViewWidget accepts a template attribute that allows the format of date values to be specified. The format string is processed with the following substitutions:

TokenSubstituted Value
DDDDay of week in full (eg, "Monday")
dddShort day of week (eg, "Mon")
DDDay of month
0DDAdds a leading zero
DDthAdds a suffix
WW~ISO-8601 week number of year
0WWAdds a leading zero
MMMMonth in full (eg, "July")
mmmShort month (eg, "Jul")
MMMonth number
0MMAdds leading zero
YYYYFull year
YYTwo digit year
wYYYYFull year with respect to week number
wYYTwo digit year with respect to week number
hhHours
0hhAdds a leading zero
hh12Hours in 12 hour clock
0hh12Hours in 12 hour clock with leading zero
mmMinutes
0mmMinutes with leading zero
ssSeconds
0ssSeconds with leading zero
am or pmLower case AM/PM indicator
AM or PMUpper case AM/PM indicator
TZDTimezone offset
\xUsed to escape a character that would otherwise have special meaning

Note that other text is passed through unchanged, allowing commas, colons or other separators to be used.

Examples

TemplateOutput
DDth MMM YYYY16th February 2011
DDth MMM \M\M\M YYYY16th February MMM 2011
DDth mmm hh:mm:ss16th Feb 2011 11:38:42

definitions

9 months ago

These are definitions of technical words and phrases used in this documentation. (As distinct from the concepts that make up TiddlyWiki itself).

Definitions in WikiText

6 months ago

HTML definition lists are created with this syntax:

demo

9 months ago

These are sample tiddlers provided as part of TiddlyWiki's documentation.

deserializers

3 months ago

dev

3 months ago

Developing plugins using Node.js and GitHub

3 months ago

The most practical way to develop plugins is to use Node.js with the tiddlywiki5 repository to build your plugins, and to use GitHub to manage you files.

Step by step

1. Setup your development environment

First read http://tiddlywiki.com/static/PluginMechanism.html.

Install Git from http://git-scm.com/downloads

Install Node.js from http://nodejs.org/

2. Create a new blank repository on GitHub

Hint: GitHub repositories cannot be grouped together into directories, so it is only possible to group by using a naming scheme, e.g. use 'TW5-' as a name prefix with tiddlywiki5 projects to group them together.

Go to https://github.com/ and create new a repository 'pluginname' - choose to add a readme file.

3. Setup a working environment

Choose a location in your file system (eg TW5) for you plugin project; issue commands to:

–create the directory–

mkdir TW5

–make a local read-only copy of the tiddlywiki5 repository–

git clone https://github.com/Jermolene/TiddlyWiki5.git TW5

–make a directory for your plugin–

cd TW5
cd plugins
mkdir yourname
cd yourname
mkdir pluginname

–make a local copy of you plugin repository–

git clone https://github.com/yourgithub/pluginname.git pluginname

–go to your files–

cd pluginname

Create the file plugin.info with content:

{
	"title": "$:/plugins/yourgithub/pluginname",
	"description": "summary of the plugin's purpose",
	"author": "yourname",
	"version": "0.0.1",
	"core-version": ">=5.0.8",
	"source": "https://github.com/yourgithub/pluginname",
	"plugin-type": "plugin"
}

4. Create your plugin's files

For example files see the plugins in the tiddlywiki5 repository i.e. those located at plugins/tiddlywiki/ - Note in particular that files need to contain information that is used to tell tiddlywiki the name of the tiddler that is to be used in the tiddlywiki in place of the name of the file within the file system.

5. Build your files into a tiddlywiki

Modify editions/tw5.com/tiddlywiki.info to include a reference to your plugin directory, i.e. find "plugins": [ and add "yourname/pluginname".

From the TW5 directory issue command

./qbld.sh

the resultant file (index.html) will be placed in the build directory, the default build directory is ../jermolene.github.com relative to TW5/

6. Save your work on GitHub

From plugins/yourname/pluginname/ issue commands to:

–add all files–

git add -A

–commit to your local repository—

git commit -am "something meaningful about this check in"

–copy local changes to github–

git push

Docs

4 months ago

This is the main documentation hub for TiddlyWiki. See also TiddlyWiki for Developers.

Concepts

These are the concepts underlying TiddlyWiki. Understanding how these ideas fit together is the key to getting the most from TiddlyWiki.

Wiki Text Rules

Widgets

Widgets add dynamic functionality to WikiText.

Commands

When run under Node.js, TiddlyWiki supports a command line interface with these built-in commands.

How to use TiddlyWiki5

Tips

Hints and tips to help you get the most from TiddlyWiki.

Miscellaneous

done

11 months ago

Download

6 months ago

Download single file editions of version 5.0.13-beta of TiddlyWiki:

Get started with an empty wiki
Download a full copy of this site, including all the documentation

For more advanced configurations, you can run TiddlyWiki on Node.js.

DraftMechanism

10 months ago

Tiddlers that have a draft.of field are treated as pending drafts of the tiddler specified in the field. Draft tiddlers should also have a draft.title field that specifies the title that will be given to the tiddler when it is saved.

Several features work in concert to give the desired behaviour for draft tiddlers:

  • The ListWidget can optionally render draft tiddlers through a different template
  • The NavigatorWidget incorporates handlers for the following events:
    • tw-new-tiddler for creating a new tiddler in draft mode
    • tw-edit-tiddler for moving a tiddler into edit mode
    • tw-cancel-tiddler for cancelling a tiddler out of edit mode
    • tw-save-tiddler for saving a draft tiddler
  • Draft tiddlers are automatically excluded from search operations

DropzoneWidget

7 months ago

Introduction

The dropzone widget creates an area into which the user can drag files and other objects. It also supports pasting via the clipboard, although browser support is currently limited.

It sends a WidgetMessage: tw-import-tiddlers carrying a JSON representation of the tiddlers to be imported up through its parents. This message usually trapped by the NavigatorWidget which adds the tiddlers to the store and updates the story to display them.

Content and Attributes

The dropzone widget has no attributes, and displays any contained content within the dropzone.

Display

The dropzone widget creates an HTML <div class="tw-dropzone"> to contain its content. During a drag operation the class tw-dragover is added. CSS is used to provide user feedback.

Data types supported

The following data transfer types are supported:

  • text/vnd.tiddler - a list of tiddlers in JSON format (this format is generated by the LinkWidget)
  • text/plain - plain text
  • text/uri-list - a list of URIs as a single tiddler

EditBitmapWidget

4 months ago

Introduction

The edit bitmap widget provides a user interface in the browser for editing bitmap tiddlers. It is currently a primitive proof-of-concept, supporting resizing and painting with a single color and line width.

Content and Attributes

The content of the <$edit-bitmap> widget is ignored.

AttributeDescription
tiddlerThe tiddler to edit (defaults to the WidgetVariable: currentTiddler)

Configuration

The edit bitmap widget can be configured with these system tiddlers:

Editing Tiddlers with Emacs

20 days ago

Michael Fogleman has written an Emacs major mode called tid-mode, which is for editing TiddlyWiki .tid files. It is derived from text-mode, uses the useful minor modes org-struct and subword, and updates the modified times when you save a .tid file.

He also wrote two helper functions for using TiddlyWiki in Emacs. The first opens a tiddlers directory in Dired; the second opens TiddlyWiki in the browser.

(defun open-wiki ()
  "Opens a TiddlyWiki directory in Dired."
  (interactive)
  (dired "~/Dropbox/wiki/tiddlers/"))
(defun browse-wiki ()
  "Opens TiddlyWiki in the browser."
  (interactive)
  (browse-url "127.0.0.1:8080/"))

This latter function may require specifying a browser:

(setq browse-url-browser-function 'browse-url-generic
      browse-url-generic-program "chromium")

You can bind either of these functions with the global-set-key function:

(global-set-key (kbd "C-c w") 'open-wiki)

At the moment, these are not integrated into tid-mode.

EditTextWidget

50 days ago

Introduction

The edit text widget provides a user interface in the browser for editing text tiddler fields. The editing element is dynamically bound to the underlying tiddler value: changes to the tiddler are instantly reflected, and any edits are instantly propogated.

By default, the edit text widget generates a <textarea> as the HTML editing element when the text field is edited, and a <input type="text"> element otherwise. This behaviour can be overridden with the tag and type attributes.

Content and Attributes

The content of the <$edit-text> widget is ignored.

AttributeDescription
tiddlerThe tiddler to edit (defaults to the WidgetVariable: currentTiddler)
fieldThe field to edit (defaults to text). Takes precedence over the index attribute
indexThe index to edit
defaultThe default text to be provided when the target tiddler doesn't exist
classA CSS class to be assigned to the generated HTML editing element
placeholderPlaceholder text to be displayed when the edit field is empty
focusPopupTitle of a state tiddler for a popup that is displayed when the editing element has focus
tagOverrides the generated HTML editing element tag
sizeThe size of the input field (in characters)
typeOverrides the generated HTML editing element type attribute

EditWidget

7 months ago

Introduction

The edit widget provides a general purpose interface for editing a tiddler. It dynamically chooses the appropriate widget depending on the type of the tiddler (currently either the EditTextWidget or the EditBitmapWidget).

Content and Attributes

The content of the <$edit> widget is ignored.

AttributeDescription
tiddlerThe tiddler to edit (defaults to the WidgetVariable: currentTiddler)
fieldThe field to edit (defaults to text). Takes precedence over the index attribute
indexThe index to edit
classA CSS class to be added the generated editing widget

EncryptionMechanism

6 months ago

TiddlyWiki5 allows the entire content of a TiddlyWiki HTML file to be encrypted with the Stanford JavaScript Crypto Library. Opening an encrypted TiddlyWiki in the browser prompts for a password before decrypting and displaying the content.

For instructions on how to use TiddlyWiki5's encryption features, see Saving with Encryption.

The EncryptionMechanism is implemented with the following elements:

EncryptWidget

7 months ago

Introduction

The encrypt widget renders a filtered list of tiddlers to an encrypted block with the password currently held in the PasswordVault. The encrypted block can subsequently be decrypted by the TiddlyWiki5 BootMechanism. See the EncryptionMechanism for more details.

Content and Attributes

The content of the <$encrypt> widget is ignored.

AttributeDescription
filterFilter defining the tiddlers to be included in the encrypted block. If not specified then all non-system tiddlers are used

Environment Variables on Node.js

6 days ago

TiddlyWiki on Node.js supports the following OS environment variables for specifying a colon-delimited list of paths to search for plugins and editions:

  • TIDDLYWIKI_PLUGIN_PATH - Search path for ordinary plugins
  • TIDDLYWIKI_THEME_PATH - Search path for themes
  • TIDDLYWIKI_LANGUAGE_PATH - Search path for languages
  • TIDDLYWIKI_EDITION_PATH - Search path for editions (used by the InitCommand)

The additional paths should each point to folders structured like the equivalent directories in the TiddlyWiki5 GitHub repository: the plugin, theme and language directories contain publisher/pluginname/<files> while the edition directories contain editionname/<files>

For example:

TIDDLYWIKI_PLUGIN_PATH=~/MyPluginStore
tiddlywiki mywiki --build index

Examples

3 months ago

This collection showcases inspiring and interesting examples of TiddlyWiki being used in the wild.

Submit new entries to this collection via GitHub, Twitter or by posting in the TiddlyWiki Groups.

ExternalImages

13 days ago

External images in TiddlyWiki are tiddlers that point to the URI of an image, rather than embedding the full image data. They can perform better than embedded images, particularly with large numbers or sizes of images. However, using them breaks the single file pattern of TiddlyWiki.

External images are used in the browser. They can be created by the Node.js configuration when it builds a TiddlyWiki, or they can be created manually within the browser.

What is an External Image

An external image is an ordinary image tiddler that has a _canonical_uri field containing the URI of the image. The URI can be absoluate or relative to the HTML document. If the canonical URI is provided then the text field of the tiddler is ignored and so should be omitted.

Manually Creating External Images

To manually create an external image just create the tiddler with the appropriate image content type, and add a _canonical_uri field with a URI pointing to the actual image location.

Creating external images under Node.js

The following steps are used to create a static HTML file version of a wiki accompanied by an images folder containing the referenced external images:

  1. Create image tiddlers in your TiddlyWikiFolders in the usual way
  2. Save the images as separate files (by convention, in a subfolder named images)
  3. Externalise the image tiddlers by giving them a _canonical_uri field
  4. Save the main HTML file

Note the image files must be saved before they are externalised. Externalising them destroys the text field within the in-memory copy of the wiki store, meaning that attempts to save them will fail.

For an example see the externalimages build target of the demo tw5.com wiki:

--savetiddlers [is[image]] images
--setfield [is[image]] _canonical_uri $:/core/templates/canonical-uri-external-image text/plain
--setfield [is[image]] text "" text/plain
--rendertiddler $:/core/save/all externalimages.html text/plain

Saving Separate Image Files

The following --savetiddlers command can be used to save the images of a wiki into an images subfolder:

--savetiddlers [is[image]] images

Externalising Image Tiddlers

Two --setfield commands are used: the first sets the _canonical_uri field to a URI derived from the title of the tiddler, and the second clears the text field.

--setfield [is[image]] _canonical_uri $:/core/templates/canonical-uri-external-image text/plain
--setfield [is[image]] text "" text/plain

The template tiddler $:/core/templates/canonical-uri-external-image contains:

<!--

This template is used to assign the ''_canonical_uri'' field to external images.

Change the `./images/` part to a different base URI. The URI can be relative or absolute.

-->
./images/<$view field="title" format="doubleurlencoded"/>

Note that these operations modify the tiddlers in the wiki store and so may affect the operation of subsequent commands.

Using External Images

You can't edit an external image directly in the browser except by changing the URI field to point to a different image.

faq

9 months ago

features

12 months ago

Features

3 months ago

The deep internal changes mean that TiddlyWiki version 5 is not compatible with previous versions, using different plugins, themes and so on. Content prepared for previous versions of TiddlyWiki will need massaging to work properly. When asking or searching for help be sure to specify TiddlyWiki5 (or TW5).

FederatialLimited

9 months ago

Federatial Limited is a software consultancy founded by JeremyRuston specializing in understanding the impact of the web on the way that we work together.

See http://federatial.com/ and http://twitter.com/federatial for more information.

FieldManglerWidget

4 months ago

Introduction

The field mangler widget manipulates the fields and tags of a tiddler. It does so in response to the following WidgetMessages:

MessageDescription
tw-remove-fieldRemove the field specified in event.param
tw-add-fieldAdd the field specified in event.param
tw-remove-tagRemove the tag specified in event.param
tw-add-tagAdd the tag specified in event.param

Content and Attributes

The field mangler widget displays any contained content, and responds to WidgetMessages dispatched within it.

AttributeDescription
tiddlerTitle of the tiddler to manipulate (defaults to the WidgetVariable: currentTiddler)

FieldsWidget

7 months ago

Introduction

The fields widget renders each field of a specified tiddler through a simple text template. A list of fields to exclude can be provided. It is used internally by TiddlyWiki5, notably by the FileSavingMechanism.

Template Handling

The provided template is rendered with the following special substitutions:

SymbolSubstitution
$name$Field name
$value$Field value
$encoded_value$HTML encoded form of field value

Content and Attributes

The content of the <$fields> widget is ignored.

AttributeDescription
tiddlerTitle of the tiddler from which the fields are to be displayed (defaults to the WidgetVariable: currentTiddler)
templateText of the template (see above)
excludeLists of fields to be excluded (defaults to "text")
stripTitlePrefixIf set to "yes" then curly bracketed prefixes are removed from titles (for example {prefix}HelloThere converts to HelloThere)

The stripTitlePrefix attribute is used when building TiddlyWiki Classic; see editions/tw2 in the TiddlyWiki5 repo.

FilterOperator: after

42 days ago

The after filter operator returns the tiddler from the current list that is after the tiddler named in the operand.

The following examples assume a tiddler called MyList with a list field containing:

one two three four five
Filter StringDescription
[list[MyList]after[two]]Returns three
[list[MyList]after[five]]Returns an empty list
[list[MyList]after{!!title}]Returns five if the current tiddler is four

See also FilterOperator: before, FilterOperator: previous and FilterOperator: next.

FilterOperator: all

2 months ago

The all filter operator is used to select combinations of lists of tiddlers for subsequent operations.

The operand of the all operator is a list of names of tiddler sources joined with +.

For example:

Filter StringDescription
[all[tiddlers]]Selects all 'real' tiddlers (both system and non-system), excluding shadow tiddlers
[all[shadows]]Selects all ShadowTiddlers, including those that have been overridden with real tiddlers
[all[shadows+tiddlers]]Selects all ShadowTiddlers and all 'real' tiddlers together
[all[current]]Selects the current tiddler
[all[missing]]Selects all MissingTiddlers
[all[orphans]]Selects all OrphanTiddlers

FilterOperator: backlinks

2 months ago

The backlinks filter operator replaces the current list with a list of the non-system tiddlers that link to them.

For example:

Filter StringDescription
[[HelloThere]backlinks[]]Selects all tiddlers that contain links to the tiddler HelloThere
[tag[Personal]backlinks[]]Selects all tiddlers that contain links to tiddlers tagged Personal
[all[current]backlinks[]]Selects all tiddlers that contain links to the current tiddler

FilterOperator: before

42 days ago

The before filter operator returns the tiddler from the current list that is before the tiddler named in the operand.

The following examples assume a tiddler called MyList with a list field containing:

one two three four five
Filter StringDescription
[list[MyList]before[two]]Returns one
[list[MyList]before[one]]Returns an empty list
[list[MyList]before{!!title}]Returns three if the current tiddler is four

See also FilterOperator: after, FilterOperator: previous and FilterOperator: next.

FilterOperator: bf

2 months ago

The bf filter operator is a synonym for FilterOperator: rest.

FilterOperator: butfirst

2 months ago

The butfirst filter operator is a synonym for FilterOperator: rest.

FilterOperator: butlast

2 months ago

Without an operand, the butlast filter operator returns all but the last entry in the current list. The optional operand specifies the number of entries to omit.

For example:

Filter StringDescription
one two three four five +[butlast[]]Returns one, two, three, four
one two three four five +[butlast[2]]Returns one, two, three

FilterOperator: commands

2 months ago

The commands filter operator replaces the current list with a list of the available commands (see the HelpCommand for details).

For example:

Filter StringDescription
[commands[]]Returns a list of the available command names

FilterOperator: each

2 months ago

The each filter operator filters the current list to leave only the first tiddler with each distinct value for a specified field.

For example:

Filter StringDescription
[all[tiddlers]sort[title]each[type]]Returns a list of the first tiddler with each distinct type field

The each operator can be used to group tiddlers. For example, the following example creates a list of tiddlers split into types:

application/pdf

Motovun Jack.pdf

image/jpeg

Motovun Jack.jpg

image/png

TiddlyWiki Classic.png

image/svg+xml

Motovun Jack.svg
Server Architecture.svg
Startup Modules.svg
Tiddler Fishes.svg
TiddlyWiki Architecture.svg

text/plain

packge.json for node-webkit

FilterOperator: eachday

2 months ago

The eachday filter operator filters the current list to leave only the first tiddler that has a distinct value for a specified date field.

For example:

Filter StringDescription
[eachday[created]]Returns a list of the first tiddler created on each distinct day

The eachday operator can be used to group tiddlers. For example, the following wiki text creates a list of the number of tiddlers that were modified on each day:

24 June 2014: 3 modifications

21 June 2014: 2 modifications

19 June 2014: 4 modifications

17 June 2014: 5 modifications

14 June 2014: 3 modifications

13 June 2014: 2 modifications

12 June 2014: 1 modifications

11 June 2014: 1 modifications

10 June 2014: 1 modifications

9 June 2014: 2 modifications

7 June 2014: 1 modifications

4 June 2014: 2 modifications

30 May 2014: 1 modifications

26 May 2014: 2 modifications

17 May 2014: 1 modifications

16 May 2014: 3 modifications

13 May 2014: 1 modifications

12 May 2014: 2 modifications

9 May 2014: 1 modifications

5 May 2014: 2 modifications

2 May 2014: 3 modifications

27 April 2014: 2 modifications

26 April 2014: 1 modifications

25 April 2014: 2 modifications

24 April 2014: 1 modifications

19 April 2014: 3 modifications

18 April 2014: 2 modifications

16 April 2014: 2 modifications

15 April 2014: 1 modifications

10 April 2014: 43 modifications

9 April 2014: 1 modifications

3 April 2014: 2 modifications

27 March 2014: 1 modifications

24 March 2014: 2 modifications

22 March 2014: 1 modifications

21 March 2014: 10 modifications

20 March 2014: 4 modifications

18 March 2014: 1 modifications

17 March 2014: 2 modifications

12 March 2014: 5 modifications

3 March 2014: 1 modifications

2 March 2014: 3 modifications

28 February 2014: 3 modifications

26 February 2014: 17 modifications

25 February 2014: 11 modifications

24 February 2014: 2 modifications

23 February 2014: 1 modifications

22 February 2014: 3 modifications

21 February 2014: 1 modifications

20 February 2014: 1 modifications

17 February 2014: 2 modifications

16 February 2014: 1 modifications

14 February 2014: 2 modifications

13 February 2014: 1 modifications

11 February 2014: 8 modifications

10 February 2014: 1 modifications

6 February 2014: 6 modifications

29 January 2014: 2 modifications

28 January 2014: 1 modifications

26 January 2014: 3 modifications

25 January 2014: 3 modifications

22 January 2014: 2 modifications

20 January 2014: 1 modifications

19 January 2014: 3 modifications

13 January 2014: 1 modifications

12 January 2014: 1 modifications

11 January 2014: 1 modifications

7 January 2014: 2 modifications

5 January 2014: 2 modifications

4 January 2014: 4 modifications

3 January 2014: 3 modifications

2 January 2014: 1 modifications

1 January 2014: 3 modifications

30 December 2013: 1 modifications

29 December 2013: 1 modifications

28 December 2013: 7 modifications

24 December 2013: 2 modifications

22 December 2013: 1 modifications

21 December 2013: 1 modifications

18 December 2013: 1 modifications

15 December 2013: 2 modifications

14 December 2013: 4 modifications

13 December 2013: 1 modifications

12 December 2013: 6 modifications

11 December 2013: 3 modifications

7 December 2013: 1 modifications

6 December 2013: 3 modifications

5 December 2013: 5 modifications

3 December 2013: 3 modifications

30 November 2013: 2 modifications

29 November 2013: 7 modifications

28 November 2013: 2 modifications

22 November 2013: 1 modifications

15 November 2013: 2 modifications

12 November 2013: 1 modifications

11 November 2013: 1 modifications

10 November 2013: 1 modifications

9 November 2013: 1 modifications

8 November 2013: 2 modifications

1 November 2013: 7 modifications

30 October 2013: 11 modifications

7 September 2013: 2 modifications

1 September 2013: 1 modifications

30 August 2013: 2 modifications

29 August 2013: 1 modifications

28 August 2013: 3 modifications

26 August 2013: 1 modifications

25 August 2013: 19 modifications

23 August 2013: 1 modifications

22 August 2013: 1 modifications

20 August 2013: 1 modifications

9 August 2013: 2 modifications

5 July 2013: 1 modifications

13 June 2013: 2 modifications

8 May 2013: 1 modifications

6 May 2013: 1 modifications

2 March 2013: 1 modifications

FilterOperator: field

2 months ago

The field filter operator filters the current list according to whether a field matches a specified value.

The operand is the value to match, and the suffix is used to identify the field. For example:

Filter StringDescription
[field:modifier[JeremyRuston]]Returns a list of the tiddlers created by JeremyRuston
[modifier[JeremyRuston]]Returns a list of the tiddlers created by JeremyRuston | Note that if an unknown filter operator [unknown[xxx]] is encountered it is interpreted as [field:unknown[xxx]].

Note that if an unknown filter operator `[unknown[xxx]]` is encountered it is interpreted as `[field:unknown[xxx]]`.

FilterOperator: first

2 months ago

The first filter operator returns the first entries in the current list. The optional operand specifies the number of entries to return.

For example:

Filter StringDescription
one two three +[first[]]Returns one
one two three +[first[2]]Returns one, two

FilterOperator: get

58 days ago

The get filter operator replaces the titles of the tiddlers in the current list with the values of the field specified by the operand.

For example:

Filter StringDescription
[all[current]get[draft.of]]If the current tiddler is a draft, returns the original tiddler, otherwise returns an empty list

FilterOperator: has

2 months ago

The has filter operator chooses tiddlers from the current list that have a non-empty value for the field specified in the operand.

For example:

Filter StringDescription
[has[modifier]]Returns tiddlers that have a modifier field

FilterOperator: indexes

2 months ago

The indexes filter operator returns a list of all the property indexes found in the DataTiddlers in the current list. Tiddlers that are not DataTiddlers are ignored.

For example:

Filter StringDescription
[[MyData]indexes[]]Returns the indexes of all properties in the data tiddler MyData
[{$:/palette}indexes[]sort[title]]Returns the names of all the colours defined in the current colour palette

FilterOperator: is

2 months ago

The is filter operator selects tiddlers from the current list according to their membership of the category specified in the operand:

  • [is[current]] - returns any tiddler that matches the title of the current tiddler
  • [is[image]] - tiddlers that contain an image (eg, GIF, JPEG, PNG etc.)
  • [is[missing]] - MissingTiddlers that are referenced but undefined
  • [is[orphan]] - OrphanTiddlers that are not referenced from any other tiddler
  • [is[shadow]] - tiddlers that are ShadowTiddlers
  • [is[system]] - tiddlers that are SystemTiddlers
  • [is[tiddler]] - tiddlers that are not MissingTiddlers
  • [is[tag]] - tiddlers that are being used as tags

For example:

Filter StringDescription
[tag[task]is[shadow]]Returns ShadowTiddlers tagged task
[tag[task]!is[system]]Returns non-SystemTiddlers tagged task
[is[shadow]]Returns ShadowTiddlers that have been overridden by a 'real' tiddler
[!is[shadow]]Returns ordinary tiddlers that are not shadow tiddlers
[!is[tag]]Returns all tiddlers that are not being used as tags
[is[missing]]Returns an empty list (see note below)

Note that the is filter operator strictly filters the current list by choosing whether or not to include each one in the output. It never adds tiddlers to the results that are not already listed. This means that when used at the start of a run of filter operators the is operator will be choosing from the currently existing tiddlers, and so will never return missing tiddlers, or shadow tiddlers that haven't been overridden.

FilterOperator: last

2 months ago

The last filter operator returns the last entries in the current list. The optional operand specifies the number of entries to return.

For example:

Filter StringDescription
one two three +[last[]]Returns three
one two three +[last[2]]Returns two, three

FilterOperator: limit

2 months ago

The limit filter operator trims the current list to the length specified in the operator. Usually the first tiddlers in the list are returned; preceding the operator with ! causes it to instead return the last tiddlers in the list.

For example:

Filter StringDescription
[sort[modified]!limit[20]]Returns the titles of the last 20 tiddlers to have been modified
[has[created]sort[created]limit[10]]Returns the titles of the oldest 10 tiddlers to have been created

FilterOperator: links

2 months ago

The links filter operator replaces the current list with a list of the targets of outgoing links from those tiddlers.

For example:

Filter StringDescription
[[HelloThere]links[]]Returns the titles of tiddlers linked from HelloThere
[all[current]links[]]Returns the titles of tiddlers linked from the current tiddler

FilterOperator: list

2 months ago

The list filter operator replaces the current list with the list contained in the TextReference specified in the operand. The default field for the text reference is list.

Preceding the operator name with ! inverts the logic so that the filter only returns the tiddlers in the current list that are not listed in the specified list.

For example:

Filter StringDescription
[list[HelloThere]]Returns the list of tiddlers in the list field of the tiddler HelloThere
[list[HelloThere!!mylist]]Returns the list of tiddlers in the mylist field of the tiddler HelloThere

FilterOperator: listed

10 days ago

The listed filter operator returns the titles of the tiddlers that have list fields that contain any members of the current list. The optional operand can be used to specify a different field.

For example:

Filter StringDescription
[[HelloThere]listed[]]Returns the titles of any tiddlers containing HelloThere in their list fields
[all[current]listed[my-special-list]]Returns the titles of any tiddlers containing the current tiddler in their my-special-list fields

FilterOperator: modules

2 months ago

The modules filter operator treats the current list as a list of module types, and returns the titles of all of the modules of those types.

For example:

Filter StringDescription
[[filteroperator]modules[]]Returns a list of the modules of type filteroperator

See also FilterOperator: moduletypes.

FilterOperator: moduletypes

2 months ago

The moduletypes filter operator replaces the current list with a list of the types of the currently loaded modules.

For example:

Filter StringDescription
[moduletypes[]]Returns a list of the types of the currently loaded modules

See also FilterOperator: modules.

FilterOperator: next

2 months ago

The next filter operator takes each tiddler in the current list and looks it up in the list field of the tiddler specified in the operand, and then returns the immediately following tiddler title.

The following examples assume a tiddler called MyList with a list field containing:

one two three four five
Filter StringDescription
[[three]next[MyList]]Returns four
[[five]next[MyList]]Returns an empty list
one three +[next[MyList]]Returns two, four

See also FilterOperator: previous.

FilterOperator: nsort

2 months ago

The nsort filter operator sorts the current list as numeric values. String values are sorted case insensitively (upper and lower case letters are considered equivalent). Preceding the operator with ! reverses the sort order.

For example:

Filter StringDescription
10 010 1000 100 +[nsort[]]Returns 10, 010, 100, 1000
10 010 alpha 1000 100 +[nsort[]]Returns 10, 010, 100, 1000, alpha

See also FilterOperator: sort, FilterOperator: sortcs and FilterOperator: nsortcs.

FilterOperator: nsortcs

2 months ago

The nsortcs filter operator sorts the current list as numeric values. String values are sorted case sensitively (upper and lower case letters are considered different). Preceding the operator with ! reverses the sort order.

For example:

Filter StringDescription
10 010 1000 100 +[nsortcs[]]Returns 10, 010, 100, 1000
10 010 alpha 1000 100 +[nsortcs[]]Returns 10, 010, 100, 1000, alpha

See also FilterOperator: sort, FilterOperator: sortcs and FilterOperator: nsort.

FilterOperator: nth

2 months ago

Without an operand, the nth filter operator returns the first entry in the current list. The optional operand specifies the number of entries to return.

For example:

Filter StringDescription
one two three four five +[nth[]]Returns one
one two three four five +[nth[3]]Returns three

FilterOperator: plugintiddlers

2 months ago

The plugintiddlers filter operator returns the titles of the shadow tiddlers within any plugin tiddlers in the current list.

For example:

Filter StringDescription
[[$:/core]plugintiddlers[]]Returns a list of the shadow tiddlers within the $:/core module

See also FilterOperator: shadowsource.

FilterOperator: prefix

2 months ago

The prefix filter operator returns the titles in the current list that start with a specified prefix. If the prefix operator is preceded by ! then it returns the titles that do not start with the specified prefix.

For example:

Filter StringDescription
[tag[task]!prefix[hidden]]Returns tiddlers tagged task whose titles do not start with hidden
[prefix[$:/]]Equivalent to [is[system]]

See also FilterOperator: removeprefix.

FilterOperator: previous

2 months ago

The previous filter operator takes each tiddler in the current list and looks it up in the list field of the tiddler specified in the operand, and then returns the immediately preceding tiddler title.

The following examples assume a tiddler called MyList with a list field containing:

one two three four five
Filter StringDescription
[[three]previous[MyList]]Returns two
[[one]previous[MyList]]Returns an empty list
two four +[previous[MyList]]Returns one, three

See also FilterOperator: next.

FilterOperator: removeprefix

2 months ago

The removeprefix filter operator returns the titles in the current list that start with a specified prefix with the prefix removed.

For example:

Filter StringDescription
tid-one tid-two three +[removeprefix[tid-]]Returns one, two

See also FilterOperator: prefix.

FilterOperator: rest

2 months ago

Without an operand, the rest filter operator returns all but the first entry in the current list. The optional operand specifies the number of entries to omit.

For example:

Filter StringDescription
one two three four five +[rest[]]Returns two, three, four, five
one two three four five +[rest[2]]Returns three, four, five

FilterOperator: reverse

2 months ago

The reverse filter operator reverses the order of the titles in the current list.

For example:

Filter StringDescription
one two three +[reverse[]]Returns the list three, two, one

FilterOperator: sameday

2 months ago

The sameday filter operator filters the current list to leave only those tiddlers whose modified field is on the same day as the date provided as the operand. The optional suffix allows a different field to be specified.

For example:

Filter StringDescription
[sameday[20140410]]Returns a list of the tiddlers modified on the 10th April 2014
[sameday:created[20140410]]Returns a list of the tiddlers created on the 10th April 2014

See FilterOperator: eachday for an example.

FilterOperator: search

2 months ago

The search filter operator filters the current list to leave only those tiddlers that include the operand text in their title, body or tags. Preceding the operator with ! returns all tiddlers that do not include the specified text. The search is case-insenstive.

For example:

Filter StringDescription
[search[alsatian]]Returns a list of the tiddlers containing the text "alsatian"
[all[shadows]search[alsatian]]Returns a list of the shadow tiddlers containing the text "alsatian"

FilterOperator: shadowsource

2 months ago

The shadowsource filter operator returns the titles of the plugin tiddlers containing any ShadowTiddlers in the current list.

For example:

Filter StringDescription
[[$:/core/copyright.txt]shadowsource[]]Returns $:/core, which is the plugin that contains the shadow tiddler $:/core/copyright.txt

See also FilterOperator: plugintiddlers.

FilterOperator: sort

2 months ago

The sort filter operator sorts the current list case insensitively (upper and lower case letters are considered equivalent). Preceding the operator with ! reverses the sort order.

For example:

Filter StringDescription
one two three four +[sort[]]Returns four, one, three, two
one two Three four +[sort[]]Returns four, one, Three, two

See also FilterOperator: nsort, FilterOperator: sortcs and FilterOperator: nsortcs.

FilterOperator: sortcs

2 months ago

The sortcs filter operator sorts the current list case sensitively (upper and lower case letters are considered different). Preceding the operator with ! reverses the sort order.

For example:

Filter StringDescription
one two Three four +[sortcs[]]Returns Three, four, one, two

See also FilterOperator: sort, FilterOperator: nsort and FilterOperator: nsortcs.

FilterOperator: tag

2 months ago

The tag filter operator returns the tiddlers in the current list that have the tag specified in the operand. Preceding the operator with ! returns tiddlers that do not have the specified tag.

For example:

Filter StringDescription
[tag[mytag]]Returns all tiddlers tagged mytag
[all[shadows]tag[mytag]]Returns all ShadowTiddlers tagged mytag
[all[shadows+tiddlers]tag[mytag]]Returns all ShadowTiddlers and non-ShadowTiddlers tagged mytag
[!tag[mytag]]Returns all tiddlers not tagged mytag
[tag[mytag]!tag[exclude]]Returns all tiddlers tagged mytag that are not tagged mytag

See also FilterOperator: tagging, FilterOperator: tags and FilterOperator: untagged.

FilterOperator: tagging

2 months ago

The tagging filter operator returns all the tiddlers that are tagged by the tiddlers in the current list.

For example:

Filter StringDescription
[[mytag]tagging[]]Returns all tiddlers tagged mytag
[all[current]tagging[]]Returns all tiddlers tagged by the current tiddler

See also FilterOperator: tag, FilterOperator: tags and FilterOperator: untagged.

FilterOperator: tags

2 months ago

The tags filter operator returns all the tags present on the tiddlers in the current list.

For example:

Filter StringDescription
[[mytiddler]tags[]]Returns all tags for the tiddler mytiddler
[all[shadows+tiddlers]tags[]]Returns all the tags used on ShadowTiddlers or non-ShadowTiddlers

See also FilterOperator: tag, FilterOperator: tagging and FilterOperator: untagged.

FilterOperator: title

2 months ago

The title filter operator replaces the current list with the title specified in the operand.

For example:

Filter StringDescription
[[mytiddler]]Returns the title mytiddler
[title[mytiddler]]Returns the title mytiddler

Note that the title operator is the default when no operator name is specified.

FilterOperator: untagged

2 months ago

The untagged filter operator selects from the current list any tiddlers that do not have any tags.

For example:

Filter StringDescription
[untagged[]]Returns the titles of all tiddlers without tags
[all[shadows]untagged[]]Returns all the ShadowTiddlers without tags

See also FilterOperator: tag, FilterOperator: tagging and FilterOperator: tags.

FilterOperators

2 months ago

Formatting in WikiText

5 months ago

Available character formatting includes:

  • `backticks` for code
    • Alternatively, ``double backticks allows `embedded` backticks``
  • ''bold'' for bold text
  • //italic// for italic text
  • __underscore__ for underscored text
  • ^^superscript^^ for superscript text
  • ,,subscript,, for subscripted text
  • ~~strikethrough~~ for strikethrough text

See also: Code Blocks in WikiText

Freedom Bits - preserve your rights to free speech and association

9 months ago

A manifesto for the preservation of free speech through the exchange of randomized data.

Worried that using encryption will make you stand out from the crowd?

Do something about it!

Preserve our rights to free speech and association by sending Randomized Data to your friends and friends of friends – only to those who have given their consent – and encourage them to do the same.

We call data like that Freedom Bits.

Future of TiddlyWiki

4 months ago

TiddlyWiki is designed with the long term needs of its users in mind. Because it is OpenSource and needs no infrastructure, we can be confident that all we'll need to access a TiddlyWiki file even in the far future is an ordinary HTML browser. If you're starting to use TiddlyWiki at the beginning of your career you can be confident that it will carry you through to retirement.

Generating Static Sites with TiddlyWiki

3 months ago

TiddlyWiki5 can be used to generate static HTML representations of a TiddlyWiki that doesn't need JavaScript.

There is much flexibility in how the static HTML is generated. The following scenarios are all illustrated on http://tiddlywiki.com.

Wiki Snapshots and Tiddler Snapshots

You can explore a static representation of this TiddlyWiki at static.html. That file is a static snapshot of the current DefaultTiddlers. Any tiddlers that it links to are referred to via URLs of the form /static/HelloThere.html that point to static snapshots of individual tiddlers. The tiddler HTML files reference a static.css stylesheet file.

The included bld.sh script includes these commands that are involved in generating the sample static version of the TiddlyWiki5 site:

--rendertiddler $:/core/templates/static.template.html $TW5_BUILD_OUTPUT/static.html text/plain \
--rendertiddler $:/core/templates/static.template.css $TW5_BUILD_OUTPUT/static/static.css text/plain \
--rendertiddlers [!is[system]] $:/core/templates/static.tiddler.html $TW5_BUILD_OUTPUT/static text/plain \

The first RenderTiddlerCommand saves the static version of the DefaultTiddlers, the second saves the stylesheet, and the final RenderTiddlersCommand generates the HTML representations of individual tiddlers.

Wiki Snapshot with Internal Links

It is also possible to produce a single HTML file that contains static representations of tiddlers, and uses standard HTML anchor links to jump between them.

For example: alltiddlers.html

The example is built by the following line in bld.sh:

--rendertiddler $:/core/templates/alltiddlers.template.html $TW5_BUILD_OUTPUT/alltiddlers.html text/plain \

Get the Ring

9 months ago

This is a sample task for the TaskManagementExample

Getting Started Video

5 months ago

This brief tutorial takes you through the basics of saving changes with a standalone TiddlyWiki5 file.

GettingStarted

4 months ago

TiddlyWiki is very flexible, and there are many different ways to use it. Here we're focusing on using it as a standalone file in the browser, which is a good choice for most users as it doesn't require any special knowledge or tools. For more options you can also run TiddlyWiki on Node.js.

Video Tutorials are available, too.

The 'works anywhere' method

This method of saving changes is clunky but has the advantage of working on almost all desktop browsers, and many mobile browsers.

  1. Download an empty TiddlyWiki by clicking this button:

    If the button doesn't work save this link: http://tiddlywiki.com/empty.html

    Your browser may ask you to accept the download before it begins

  2. Locate the file you just downloaded
    • You may rename it, but be sure to keep the .html or .htm extension
  3. Open the file in your browser
  4. Try creating a new tiddler using the plus button in the sidebar. Type some content for the tiddler, and click the tick button
  5. Save your changes by clicking the download button in the sidebar
  6. Your browser will download a new copy of the wiki incorporating your changes
  7. Locate the newly downloaded file and open it in your browser
  8. Verify that your changes have been saved correctly

Tip: most browsers have an option to prompt each time for the download location. This allows you to select the existing version of the file and replace it.

The convenient and fast method

Saving changes as described above is quite inconvenient because of the degree of manual intervention that browsers require. The following alternative method is recommended for everyone who is able to use Mozilla's Firefox browser.

If you're using Firefox for Android, see the instructions for Saving with TiddlyFox on Android.

  1. Ensure you have the latest version of Firefox
  2. Install the latest release of the TiddlyFox extension from:
  3. Restart Firefox
  4. Download an empty TiddlyWiki by clicking this button:

  5. Locate the file you just downloaded
    • You may rename it, but be sure to keep the .html or .htm extension
  6. Open the file in Firefox
  7. Click OK in response to the prompt from TiddlyFox that asks whether to enable saving for this file
  8. Try creating a new tiddler using the plus button in the sidebar. Type some content for the tiddler, and click the tick button
  9. Save your changes by clicking the download button in the sidebar
    • Look for the yellow notification Saved wiki at the top right of the window
  10. Refresh the browser window to verify that your changes have been saved correctly

Other ways of saving changes

Saving with Encryption explains how to use TiddlyWiki's built-in encryption to protect your content with a password.

You can also try:

Go to Mordor

9 months ago

This is a sample task for the TaskManagementExample

GoogleChromeTips

6 months ago

Some suggestions for streamlining working with GoogleChrome.

Download Prompts

By default, GoogleChrome displays a confirmation prompt at the bottom of the browser window before downloading the TiddlyWiki file. Once confirmed, the file is downloaded to the default Downloads folder under a filename determined by the browser.

In Chrome settings, the advanced option "Ask where to save each file before downloading" changes this behaviour so that when you click the save button the browser displays a file picker dialogue that lets the user choose the name and location of the file, thus making it more straightforward to replace the current version of the file with the new one.

GridDemo_A_1

The A1 of cells

GridDemo_A_2

The A2 is a road from London through Kent

GridDemo_A_3

Take the A3 if you want to go to Basingstoke

GridDemo_B_1

Vitamin B1

GridDemo_B_2

This is cell B2, which is also transcluding A2: The A2 is a road from London through Kent.

GridDemo_B_3

B3 or 4

GridDemo_C_1

C1 eat one

GridDemo_C_2

Or C2 save one for later

GridDemo_C_3

This is cell C3, with an image

GridWidget

The video widget is not yet (re)implemented.

The grid widget assembles tiddlers into a tabular grid based on their titles. For example:

<$grid prefix="GridDemo" rows=3 cols=3/>

In this case, the following tiddlers will be rendered:

|GridDemo_A_1 |GridDemo_A_2 |GridDemo_A_3 |
|GridDemo_B_1 |GridDemo_B_2 |GridDemo_B_3 |
|GridDemo_C_1 |GridDemo_C_2 |GridDemo_C_3 |

The result is:

<$grid prefix="GridDemo" rows=3 cols=3/>

Hard Linebreaks in WikiText

6 months ago

The usual handling of paragraphs in wikitext causes single line breaks to be ignored, and double linebreaks to be interpreted as the end of a paragraph.

This behaviour isn't convenient when dealing with material that incorporates hard linebreaks - for instance, poetry. You can mark a block of content as containing hard line breaks like this:

Headings in WikiText

6 months ago

Headings are specified with one or more leading ! characters:

! This is a level 1 heading

!! This is a level 2 heading

!!! This is a level 3 heading

CSS classes can be assigned to individual headings like this:

!.myStyle This heading has the class `myStyle`

HelloThere

107 seconds ago

Welcome to TiddlyWiki, a complete interactive wiki in JavaScript. It can be used as a single HTML file in the browser or as a powerful Node.js application. It is highly customisable: the entire user interface is itself implemented in hackable WikiText.

This is version 5.0.13-beta of TiddlyWiki, a major reboot designed for the next 25 years. It is currently in beta (see the detailed ReleaseHistory). There is a RoadMap for moving to the full release. It is a great time to get involved and support the future development of TiddlyWiki.

TiddlyWiki is a free, open source project that depends on your love and support for its survival.

TiddlyWikiClassic - http://classic.tiddlywiki.com

On this site, unless noted otherwise, "TiddlyWiki" refers to the new version 5, and "TiddlyWikiClassic" is used to identify the older version.

The deep internal improvements mean that the new version of TiddlyWiki is not fully compatible with TiddlyWikiClassic. Existing content will need massaging, while plugins and themes will have to be completely rewritten. The upgrade path will get smoother as the new version matures.

HelpCommand

3 months ago

Displays help text for a command:

--help [<command>]

If the command name is omitted then a list of available commands is displayed.

HelpingTiddlyWiki

4 months ago

If you find TiddlyWiki useful, there are lots of ways you can help assure its future and make it better.

Teach and Tell

OpenSource projects like TiddlyWiki thrive on the feedback and engagement of users. TiddlyWiki becomes more useful to everyone as more and more people use it. So, if you find TiddlyWiki useful, spread the word. The best possible way to assure its future is for it to become a hundred times more popular than before.

Help improve the documentation and code

There are many ways you can contribute to TiddlyWiki:

  • Writing tutorials
  • Contributing to the documentation on tiddlywiki.com
  • Making video screencasts
  • Curating relevant links, hints and tips on a wiki

The main TiddlyWiki documentation and code lives on GitHub, and welcomes contributions:

HistoryMechanism

38 days ago

The system tiddler $:/HistoryList keeps track of a list of tiddlers comprising the navigation history. Each time you click on a link to a tiddler, the title of the target tiddler is added to the top of the stack.

The history list is stored in JSON to allow additional details about the coordinates of the DOM node that initiated the navigation.

The history list also maintains the field current-tiddler that contains the name of the tiddler at the top of the stack. This field can be used like so:

<$list filter="[list[$:/StoryList]]" history="$:/HistoryList" storyview="pop">

<$button message="tw-close-tiddler" class="btn-invisible btn-mini">&times;</$button> <$link to={{!!title}}><$view field="title"/> <$reveal type="match" state="$:/HistoryList!!current-tiddler" text=<<currentTiddler>>>&#x2713;</$reveal></$link>

</$list>

Which renders the same as the "Open" sidebar tab, with the addition of a tick against the tiddler that was last navigated to.

HelloThere

GettingStarted

Upgrading

Features

Community

RoadMap

Docs

Horizontal Rules in WikiText

6 months ago

You can include a horizontal rule with three or more dashes on their own on a line:

How to build a TiddlyWiki5 from individual tiddlers

5 months ago

First install TiddlyWiki as described in Installing TiddlyWiki on Node.js.

  1. Create an empty TiddlyWikiFolder
    1. Create a new folder in a convenient place (for example ~/MyWiki)
    2. Create a file called tiddlywiki.info containing the following text:
      • {"themes": ["tiddlywiki/vanilla","tiddlywiki/snowwhite"]}
    3. Create a subfolder called tiddlers
      • Alternatively, just copy the editions/empty folder from the TiddlyWiki5 repo
  2. Create individual TiddlerFiles in the ~/MyWiki/tiddlers directory
  3. Execute the following command from the TiddlyWiki5 root directory to build a TiddlyWiki5 file from the tiddlers:
    1. tiddlywiki ~/MyWiki --rendertiddler $:/core/save/all index.html text/plain

How to create a translation for TiddlyWiki

4 months ago

Making a translation

Prerequisites:

Quick and dirty instructions:

  1. Fork the TiddlyWiki GitHub repository (https://github.com/Jermolene/TiddlyWiki5)
  2. Create a branch with the name of the translation you intend to create (eg "cy-GB" for "Welsh (United Kingdom)")
  3. Clone your forked repository to your computer (eg, /MyTranslation/TiddlyWiki5)
  4. Create a sibling directory /MyTranslation/jermolene.github.com
  5. Create a new folder in <repo>/languages for your translation
  6. Copy the contents of <repo>/core/language/en-GB into your translation folder
  7. Create a plugin.info file (see below) in your translation folder
  8. Edit <repo>/editions/tw5.com/tiddlywiki.info to add your language to the list
  9. Run ./qbld.sh to build TiddlyWiki
  10. Open the TiddlyWiki file at /MyTranslation/jermolene.github.com/index.html
  11. You should see your translation listed in the control panel, but the text of the translation will still be in British English
  12. Edit the .tid and .multids files in your language folder to translate the English text

Content of plugin.info for Joe Bloggs' Welsh translation:

{
	"title": "$:/languages/cy-GB",
	"name": "cy-GB",
	"plugin-type": "language",
	"description": "Welsh (British)",
	"author": "JoeBloggs",
	"core-version": ">=5.0.0"
}

MultiTiddlerFiles make it possible to pack the text of several tiddlers in a single text file, simplifying some editing tasks.

How to create plugins in the browser

2 months ago

The recommended technique for building TiddlyWiki plugins involves running TiddlyWiki on Node.js, but there is now an experimental technique for creating plugins directly in the browser.

Overview

Loading a plugin in the browser has several consequences:

  • The original plugin tiddler itself is unchanged
  • The payload tiddlers are set up as individual ShadowTiddlers

To make a modified copy of a plugin, one edits the constituent shadow tiddlers (doing this actually overrides the shadow tiddler with a new non-shadow tiddler containing the modified content). The repacking process retrieves the current value of all the shadow tiddlers included in the plugin, and then bundles the new values back into the original plugin tiddler.

Step by step

1. Setup your development environment

Start with a blank TiddlyWiki. It is useful to create a HelloThere tiddler that contains links to various tiddlers that you'll be opening frequently during plugin development:

  • The plugin itself (eg $:/plugins/yourname/pluginname)
  • The payload tiddlers that are to be packed into the plugin (eg $:/plugins/yourname/pluginname/mywidget.js)

2. Create the plugin tiddler

Click the link to the plugin tiddler to open it. Assuming it doesn't currently exist, it will open with an italicised title, indicating that it is a missing tiddler. Then switch to edit mode and set the following fields on the tiddler:

FieldValue
dependentsSpace separated list of dependent plugins (use square brackets for titles containing spaces)
descriptionPlugin description
plugin-typeEither "plugin" for a regular plugin, "theme" for a theme, or "language" for a language pack
typeSet to "application/json"
versionSet to the version number of the plugin (eg "0.0.1")

Then in the body of the tiddler, insert:

{"tiddlers": {}}

Save the plugin tiddler

3. Modify the payload tiddlers

Create the payload tiddlers by clicking on the links in the HelloThere tiddler from step 1.

4. Pack the plugin

Open the browser developer console, and type the following JavaScript statement, but first change the first parameter to the name of your plugin. The second parameter is an optional array of tiddler titles to be added to the plugin:

$tw.utils.repackPlugin("$:/plugins/yourname/pluginname",["$:/plugins/yourname/pluginname/mywidget.js"])

You should see a confirmation message, and then if you inspect the plugin tiddler you should see that it has been filled with the payload tiddlers.

Each time you save the plugin the last portion of the version number is automatically incremented. This will ensure that users with an older version of your plugin will be able to install the new version.

5. Repacking the plugin

Once you've built the plugin for the first time you can omit the second parameter to repackPlugin() unless you are adding a new tiddler:

$tw.utils.repackPlugin("$:/plugins/yourname/pluginname")

6. Removing tiddlers from the plugin

To remove tiddlers from the plugin specify their titles in the optional third parameter:

$tw.utils.repackPlugin("$:/plugins/yourname/pluginname",null,["$:/plugins/yourname/pluginname/mywidget.js"])

Notes

Creating theme and language plugins

Before attempting to repack your plugin you should ensure that the plugin is selected as the current theme or language. Otherwise the shadow tiddlers will not be present.

howto

3 months ago

HTML in WikiText

4 days ago

HTML tags and comments can be used directly in WikiText. For example:

<article class="hello">
This is my nice and simple block of text. HelloThere
<!-- This comment will not appear in the wikified output -->
</article>

Attributes

Attributes in HTML tags can be specified as a transclusion or a macro invocation. For example, here the value of the href attribute will be set to the value of the tiddler MyLinkDestination:

<a href={{MyLinkDestination}}>link</a>

Here an attribute is specified as a macro invocation:

<a href=<<MyMacro "Brian">>>link</a>

Literal attribute values can include line breaks. For example:

<div data-address="Mouse House,
Mouse Lane,
Rodentville,
Ratland."/>

By using triple-double quotes you can specify attribute values that include single double quotes. For example:

<div data-address="""Mouse House,
"Mouse" Lane,
Rodentville,
Ratland."""/>

Content Parsing

The content of an HTML element will be parsed in inline mode unless the opening tag is followed by two linebreaks. (Inline mode means that block mode formatting such as tables, lists and headings is not recognised).

Images in WikiText

2 months ago

Image Formatting

Images can be included in WikiText with the following syntax:

[img[Motovun Jack.jpg]]
[img[http://tiddlywiki.com/favicon.ico]]

If the image source is the title of an image tiddler then that tiddler is directly displayed. Otherwise it is interpreted as a URL and an HTML <img> tag is generated with the src attribute containing the URL.

A tooltip can also be specified:

[img[An explanatory tooltip|Motovun Jack.jpg]]

Attributes can be provided to specify CSS classes and the image width and height:

[img width=32 [Motovun Jack.jpg]]
[img width=32 class="tw-image" [Motovun Jack.jpg]]

Note that attributes can be specified as transclusions or variable references:

[img width={{!!mywidth}} class=<<image-classes>> [Motovun Jack.jpg]]

The image syntax is a shorthand for invoking the ImageWidget.

Displaying Images via Transclusion

You can also display an image stored in a tiddler by transcluding that tiddler. The disadvantage of this approach is that there is no direct way to control the size of the image.

{{Motovun Jack.jpg}}

Renders as:

ImageWidget

12 days ago

Introduction

The image widget displays images that can be specified as a remote URL or the title of a local tiddler containing the image.

Content and Attributes

Any content of the <$image> widget is ignored.

AttributeDescription
sourceThe URL of the image, or the title of an image tiddler
widthThe width of the image as a number
heightThe height of the image
tooltipThe tooltip to be displayed over the image
classCSS classes to be assigned to the <img> element

External Images and the _canonical_uri field

When used to display tiddler-based images, the image widget operates in two distinct modes:

  • If the _canonical_uri field is present then it is used as the src attribute of the generated <img> element and the text field is ignored
  • Without the _canonical_uri field, the image widget generates an <img> element that embeds the image data directly using a data: URI.

See ExternalImages for more details.

ImportTiddlers

9 months ago

You can import content into a TiddlyWiki file in several ways:

  • Use the browse button (under the Tools tab in the sidebar, or in the ControlPanel) to select one or more local files
  • Drag and drop files from Windows Explorer or Mac OS X Finder into the TiddlyWiki5 browser window
  • Paste content directly from the clipboard using the keyboard shortcut (control-V or command-V)

ImportVariablesWidget

11 days ago

Introduction

The ImportVariablesWidget imports macro and variable definitions from a list of other tiddlers and makes them available to its children. For example:

<$importvariables filter="[tag[mySpecialMacros]]">
All the macros defined in tiddlers with the tag "mySpecialMacros" are available here
</$importvariables>

Attributes and Content

The content of the importvariables widget is the scope within which the imported variable definitions are available.

AttributeDescription
filterTiddler filter defining the tiddlers from which macro definitions will be imported

Global Macros

So-called global macros are implemented within the main page template ($:/core/ui/PageTemplate) by wrapping the page content in the following importvariables widget:

<$importvariables filter="[[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]">
...
</$importvariables>

InitCommand

6 days ago

Initialise an empty WikiFolder with a copy of the specified edition.

--init <edition> [<edition> ...]

For example:

tiddlywiki ./MyWikiFolder --init empty

Note:

  • The wiki folder directory will be created if necessary
  • The "edition" defaults to empty
  • The init command will fail if the wiki folder is not empty
  • The init command removes any includeWikis definitions in the edition's tiddlywiki.info file
  • When multiple editions are specified, editions initialised later will overwrite any files shared with earlier editions (so, the final tiddlywiki.info file will be copied from the last edition)
  • --help editions returns a list of available editions

See also:

Installing TiddlyWiki on Node.js

3 months ago
  1. Install Node.js from http://nodejs.org
  2. Open a command line terminal and type:

    npm install -g tiddlywiki

    If it fails with an error you may need to re-run the command as an administrator:

    npm install -g tiddlywiki (Windows)

    sudo npm install -g tiddlywiki (Mac/Linux)

  3. Check TiddlyWiki is installed by typing:

    tiddlywiki --version

  4. In response, you should see TiddlyWiki report its current version (eg 5.0.8-beta; you may also see other debugging information reported)
  5. Try it out:
    1. tiddlywiki mynewwiki --init server to create a folder for a new wiki that includes server-related components
    2. tiddlywiki mynewwiki --server to start TiddlyWiki
    3. Visit http://127.0.0.1:8080/ in your browser
    4. Try editing and creating tiddlers

The -g flag causes TiddlyWiki to be installed globally. Without it, TiddlyWiki will only be available in the directory where you installed it.

A slightly different method for installation is recommended if you plan on forking the source code in order to study it or contribute to it. See Working with the TiddlyWiki5 repository.

internals

12 months ago

Introducing TiddlyDesktop Video

4 months ago

This brief introduction shows how to install and use TiddlyDesktop:

introduction

9 months ago

Introductory documentation.

Introduction to Filters

2 months ago

A step by step introduction to how TiddlerFilters are used.

You can experiment with tiddler filters by typing them into the "Filter" tab of the advanced search panel.

Simple Filters

The simplest example of a filter is a list of tiddler titles (if necessary quoted with double square brackets):

HelloThere Introduction [[Title with Spaces]]

The titles must be separated by one or more spaces and/or linebreaks.

Filter Operators

Filter operators are used to select tiddlers based on some criteria. For example, this filter consists of a single operation that selects all tiddlers tagged "introduction":

[tag[introduction]]

The word "tag" is the operator and "introduction" is the operand.

See TiddlerFilters for a complete list of the available operators.

Default Filter Operator

The operator defaults to title if omitted, so [[HelloThere]] is equivalent to [title[HelloThere]]. If there are no spaces in the title, then the double square brackets can also be omitted: HelloThere.

Negating Filter Operators

Filter operations can be negated by preceding the operator with an exclamation mark (!). This example selects all tiddlers that are not tagged "introduction":

[!tag[introduction]]

Operator Suffixes

Some filter operators can take an optional suffix that provides further information for the operation. For example, the "field" operator takes a suffix indicating the field to be compared. The following filter returns all tiddlers that have "JeremyRuston" in the "modifier" field:

[field:modifier[JeremyRuston]]

Field Operator Shortcut

If an unknown operator is used then it is instead interpreted as the suffix of the "field" operator. Thus, these two filters both return all the tiddlers that contain the string "create" in their "caption" field:

[caption[create]]
[field:caption[create]]

Indirect Operands

If a filter operator is written with curly brackets around the operand then it is taken to be a TextReference to the actual value. For example, this filter selects all tiddlers containing the string contained in the tiddler titled "$:/temp/search"

[search{$:/temp/search}]

Regular Expression Operands

The "field" filter also accepts regular expressions with the syntax /regexp/(modifier). For example:

  • [field:title/example/]: searches for all tiddlers having "example" in their title
  • [field:title/example$/]: $ is an "anchor" for the end of the text so that "example" has to be at the end of the title
  • [field:text/summer|winter/(i)]: Searches for tiddlers containing "summer" or "winter", ignoring case

ORing Multiple Filter Operators

You can use multiple filter operations at once. This example selects all tiddlers that are either tagged "introduction" or "demo":

[tag[introduction]] [tag[demo]]

Each separate operator is processed in turn, accumulating the tiddlers that they select.

ANDing Multiple Filter Operators

A sequence of operators can be logically ANDed together by bashing them together and merging the outer square brackets. This is called a "run" of operations. For example, here we select tiddlers that are tagged "introduction" and also tagged "demo":

[tag[introduction]tag[demo]]

Here's another example that selects all tiddlers tagged "introduction" that are not tagged "demo":

[tag[introduction]!tag[demo]]

Negating Runs of Filter Operators

Ordinarily, each run of filter operations adds to the accumulated results. Prefixing a run with - causes the list of tiddlers to instead be removed from the results. For example, this example returns all the tiddlers tagged "introduction" apart from HelloThere and Title with Spaces:

[tag[introduction]] -HelloThere -[[Title with Spaces]]

This example returns all tiddlers tagged "introduction" that are not also tagged "demo":

[tag[introduction]] -[tag[demo]]

Working with Filter Results

Usually, each run of filter operations takes as its source the entire store of available tiddlers. Prefixing a run with + causes the accumulated results to be used as the source instead.

For example, this filter selects tiddlers tagged "introduction" or "demo" and then sorts the resulting list by the "title" field:

[tag[introduction]] [tag[demo]] +[sort[title]]

JavaScript

4 months ago

JavaScript is a computer language that was originally introduced by browsers as a way of scripting web pages. At first it was considered a poorly designed toy, but over the years has become recognised as a powerful language in its own right, and has been adopted widely beyond the browser.

JavaScript looks like this:

function circleArea(radius) {
	return radius * 2 * 3.141592653;
}

JavaScript Macros

2 months ago

Macros can be implemented as JavaScript modules as well as via the wikitext syntax.

Overview

JavaScript macros are modules with their module-type field set to macro. They must export these three properties:

  • name: A string giving the name used to invoke the macro
  • params: An array of objects with the following properties:
    • name: name of the parameter
    • default: (optional) default value for the parameter
  • run: Function called when the macro requires evaluation. The parameters are pulled from the macro call and arranged according to the params array. The run function should return the string value of the macro. When invoked, this points to the widget node invoking the macro.

Note that if the params array is missing or blank, then all the supplied parameters are passed to the run() method.

Writing JavaScript macros

There are several JavaScript macros built into the core which can serve as a jumping off point for your own macros:

https://github.com/Jermolene/TiddlyWiki5/tree/master/core/modules/macros

Note that JavaScript macros work on both the client and the server, and so do not have access to the browser DOM.

Macro Behaviour

Macros are just used to return a chunk of wikitext for further processing. They should not make modifications to tiddlers in the wiki store. The reason is that you cannott control when the macro is called; it may be called repeatedly as part of refresh processing. So it is important that macros do not have any other side effects beyond generating their text.

JeremyRuston

5 months ago

I'm the inventor of TiddlyWiki. I am available through my company FederatialLimited for consultancy and speaking engagements.

You can find me on these services:

Further information:

Jermolene

9 months ago

Alias for JeremyRuston.

KeyboardShortcuts

28 days ago

Keyboard shortcut support is currently very limited but will be improved in later releases.

Editing Shortcuts

KeyShortcut description
Ctrl-EnterConfirm changes to the draft tiddler containing the keyboard focus
EscapeAbandon changes to the draft tiddler containing the keyboard focus

KeyboardWidget

3 months ago

Introduction

The keyboard widget allows WidgetMessages to be generated in response to key presses.

Content and Attributes

The content of the <$keyboard> widget is rendered normally. The keyboard shortcut only takes effect within the contained content.

AttributeDescription
messageThe title of the WidgetMessage to generate
paramThe parameter to be passed with the WidgetMessage
keyKey string identifying the key to be trapped (see below)
classA CSS class to be assigned to the generated HTML DIV element

Key Strings

Key strings are made up of zero or more of the modifiers alt, shift or ctrl followed by the name of a key, all joined with "+" plus symbols. Key names are either the letter or digit printed on the key (eg "a" or "1"), or one of the special keys backspace, tab, enter or escape.

For example:

A
shift+A
shift+escape
ctrl+enter
ctrl+shift+alt+A

Kill the Dragon

9 months ago

This is a sample task for the TaskManagementExample

Latest

3 months ago

The latest news, articles, resources and examples.

LazyLoading

4 months ago

Ordinarily with TiddlyWiki, the full content of all tiddlers is embedded into the main HTML file. Lazy loading refers to the technique of only embedding metadata about the tiddler (in other words all fields except the text field), and requesting the body from the server when required.

Lazy loading can be used in two configurations:

See the LazyLoadingMechanism for details of how lazy loading is implemented.

Lazy loading under Node.js

To run TiddlyWiki with lazy loading for images, use this alternative ServerCommand to start the server:

tiddlywiki --server 8080 $:/core/save/lazy-images

Lazy loading under TiddlyWeb

With the current configuration, lazy loading is enabled by default.

LazyLoadingMechanism

4 months ago

TiddlyWiki currently only implements LazyLoading when it is running in the browser talking to a TiddlyWeb-compatible server.

In the configuration for TiddlyWeb, the browser first requests a "skinny" version of each tiddler (consisting of all the fields apart from the text field). Subsequently, an attempt to read those skinny tiddlers with wiki.getTiddler() returns just the skinny fields, but an attempt to read one using wiki.getTiddlerText() will trigger an asynchronous load of the full tiddler text, which in turn triggers a refresh cycle, updating the display to reflect the newly loaded tiddler. Widgets that loop through all tiddlers are fine; it's only if they trigger wiki.getTiddlerText() for a tiddler that it will get loaded.

Lazy loading can also be used with TiddlyWiki's own server. The core provides a template that enables images to be lazily loaded while other tiddlers are packaged into the initial HTML file in the usual way.

The browser-based search built into TiddlyWiki5 will only search the text of tiddlers that have been fully loaded. The expectation is that when lazy loading is used in a client-server configuration, then it is the server that really needs to handle search operations, because it is only the server that can "see" the text of all tiddlers. So, the plan is to integrate the built in search with TiddlyWeb's search API. The simplest approach is that any local search triggers an asynchronous server side search. The results of the search would be asynchronously loaded such that they would dynamically appear in the local search results.

LinkCatcherWidget

2 months ago

Introduction

The link catcher widget traps WidgetMessage: tw-navigate dispatched within its child content by performing any or all of these actions:

  • sending a different widget message
  • setting a tiddler to the title of the navigated tiddler
  • setting a tiddler to a specified value

Content and Attributes

The content of the <$linkcatcher> widget is displayed normally.

AttributeDescription
toOptional title of the tiddler to be set to the title of the navigated tiddler
messageOptional identifier for a widget message to be sent when a navigation is caught
setOptional title of the tiddler to be set to a specified value when navigation occurs
setToValue to be assigned by the set attribute

Linking in WikiText

13 months ago

A key capability of WikiText is the ability to make links to other tiddlers or to external websites. There are several ways of doing this:

Link to a tiddler by title:

[[Tiddler Title]]

To link to a tiddler and specify the text of the link:

[[Displayed Link Title|Tiddler Title]]

For tiddler titles that match the CamelCase rules, just typing the title will automatically create a link.

To link to an external website, type the full URL of the site:

http://tiddlywiki.com/

[[TW5|http://tiddlywiki.com/]]

For this syntax to work, the URL has to be recognisable as an URL, including a protocol such as http:// or file://. You can force an external link with the extended syntax:

[ext[tiddlywiki.com]]

[ext[caption for link|tiddlywiki.com]]

[ext[Donate|bitcoin:1aabbdd....?amount=0.001]]

You can suppress a link from being recognised by preceding it with ~. For example:

LinkWidget

7 days ago

The link widget generates links to tiddlers.

Content and Attributes

AttributeDescription
toThe title of the target tiddler for the link (defaults to the WidgetVariable: currentTiddler)
aria-labelOptional Accessibility label
tooltipOptional tooltip WikiText

The content of the link widget is rendered within the <a> tag.

The default value of the tooltip attribute is <<tw-wikilink-tooltip>>.

This means that you can control the text of a link tooltip in several ways:

<$link to="HelloThere" tooltip="Custom tooltip">Link 1</$link>

<$set name="tw-wikilink-tooltip" value="I'm a link to {{!!title}}">
<$link to="HelloThere">Link 2</$link>
</$set>

Renders as:

Link 1

Link 2

Note that the tooltip is rendered with the current tiddler set to the target of the link.

A useful convention is to set the tooltip like this:

\define tw-wikilink-tooltip()
<$transclude field="tooltip"><$transclude field="title"/></$transclude>
\end

This causes the tooltip to be the tooltip field of the target tiddler. If the field isn't present, then the title is used instead.

CSS Classes

  • tw-tiddlylink - applied to all links
  • tw-tiddlylink-external - applied to external, non-tiddler links
  • tw-tiddlylink-internal - applied to tiddler links
  • tw-tiddlylink-missing - applied to tiddler links where the target tiddler doesn't exist
  • tw-tiddlylink-resolves - applied to tiddler links when the target tiddler does exist

Configuration macros

Configuration macros can be used to modify the behaviour of the link widget.

tw-wikilinks

Links are suppressed if the macro tw-wikilinks evaluates to the string no. For example:

\define tw-wikilinks() no

tw-wikilink-template

The target of the link widget defaults to the URL encoded title of the tiddler. The href can be templated by defining the configuration macro tw-wikilink-template, and including within it the token $uri_encoded$. For example:

\define tw-wikilink-template() http://tiddlywiki.com/#$uri_encoded$

The token $uri_doubleencoded$ is replaced by the double encoded title of the tiddler.

Note that in the browser the <a> element generated by the link widget has a JavaScript event handler that navigates directly to the target tiddler, ignoring the href attribute.

tw-wikilink-tooltip

Provides default text for the link tooltip:

\define tw-wikilink-tooltip() This is a link to {{!!title}}
<$link to="HelloThere"/>

ListField

3 months ago

The list field of a tiddler is an optional feature that can be used to help structure your content. It is defined as an ordered sequence of tiddler titles, and it can be used in several ways:

  • The list field of a tiddler that is being used as a tag determines the ordering of the tiddlers that carry that tag - see TiddlerTags for details
  • The list filter selects the entries from a list
  • The listed filter selects the tiddlers that list the selected tiddler(s)
  • The NavigatorWidget manipulates a StoryList tiddler containing a list field of the tiddlers that are displayed in the main story column

Lists in WikiText

6 months ago

Unordered Lists

You can create unordered lists with * characters:

Ordered Lists

Ordered lists use # instead of *:

  1. First item
  2. Second item
  3. Third item

You can also mix ordered and unordered list items:

CSS Classes

You can also assign a CSS class to an individual member of a list with this notation:

Mixing Lists and Block Quotes

Note that Block Quotes in WikiText can be mixed with lists. For example:

ListWidget

7 months ago

Introduction

The list widget displays a sequence of tiddlers that match a tiddler filter. It can be used for many purposes:

  • Displaying custom lists of links, like in TiddlyWiki5's sidebar
  • Custom lists, such as "all tiddlers tagged 'task' that are not tagged 'done'"
  • Listing each of the tags applied to a tiddler
  • Handling the main story river

The tiddlers can either be displayed by transcluding each in turn through an optional template.

Content and Attributes

The content of the <$list> widget is an optional template to use for rendering each tiddler in the list (alternatively, the template can be specified as a tiddler title in the template attribute).

AttributeDescription
filterThe TiddlerFilter to display
templateThe title of a template tiddler for rendering each tiddler in the list
editTemplateAn alternative template to use for DraftTiddlers in edit mode
variableThe widget variable name to be assigned the title of each tiddler in the list. Defaults to currentTiddler
emptyMessageMessage to be displayed when the list is empty
storyviewOptional name of module responsible for animating/processing the list
historyThe title of the tiddler containing the navigation history

Handling edit mode

The <$list> widget can optionally render draft tiddlers through a different template tiddler than ordinary tiddlers – see DraftMechanism for a discussion of how this capability is used.

storyview attribute

The storyview attribute specifies the name of an optional module that can animate changes to the list (including navigation). The core ships with the following storyview modules:

  • classic: renders the list as an ordered sequence of tiddlers
  • zoomin: just renders the current tiddler from the list, with a zoom animation for navigating between tiddlers
  • pop: shrinks items in and out of place

Handling history and navigation

The optional history attribute specifies the name of a tiddler that is used to track the current tiddler for navigation purposes. When the history tiddler changes the list view responds by telling the listview to handle navigating to the new tiddler. See the NavigationMechanism for more details.

Examples

Creating nested lists

The types and recent tabs in the sidebar give two examples of a grouped list created by nesting.

The types listing is performed with this markup:

<$list filter="[!is[system]has[type]each[type]sort[type]]">
<div class="tw-menu-list-item">
<$view field="type"/>
<$list filter="[type{!!type}!is[system]sort[title]]">
<div class="tw-menu-list-subitem">
<$link to={{!!title}}><$view field="title"/></$link>
</div>
</$list>
</div>
</$list>

The outer list filter selects each discrete value found in the type field. The inner list filter selects all the (non-system) tiddlers with that type.

The recent listing is performed with this markup:

<$list filter="[!is[system]has[modified]!sort[modified]limit[100]eachday[modified]]">
<div class="tw-menu-list-item">
<$view field="modified" format="date" template="DDth MMM YYYY"/>
<$list filter="[sameday{!!modified}!is[system]!sort[modified]]">
<div class="tw-menu-list-subitem">
<$link to={{!!title}}><$view field="title"/></$link>
</div>
</$list>
</div>
</$list>

Here the outer list filter selects each discrete day found in the modified field, while the inner list filter selects all the tiddlers dated the same day in the modified field.

LoadCommand

5 months ago

Load tiddlers from 2.x.x TiddlyWiki files (.html), .tiddler, .tid, .json or other files

--load <filepath>

To load tiddlers from an encrypted TiddlyWiki file you should first specify the password with the PasswordCommand. For example:

tiddlywiki ./MyWiki --password pa55w0rd --load my_encrypted_wiki.html

Note that TiddlyWiki will not load an older version of an already loaded plugin.

MacroCallWidget

7 months ago

Introduction

The macro call widget provides an alternative syntax for invoking macros. The advantage of the widget form is that it allows macro parameters to be specified as widget attributes, thus allowing indirection and macro values to be set.

For example, a macro called italicise that takes a single parameter called text can be invoked in any of these ways:

<<italicise "Text to be made into italics">>
<<italicise text:"Text to be made into italics">>
<$macrocall $name="italicise" text="Text to be made into italics"/>
<$macrocall $name="italicise" text={{Title of tiddler containing text to be italicised}}/>
<$macrocall $name="italicise" text=<<textMaker "Another macro to generate the text to be italicised">>/>

You can see several examples of the macro call widget within the core:

Content and Attributes

The content of the <$macrocall> widget is ignored.

AttributeDescription
$nameName of the macro to invoke
$typeContentType with which the macro text should be parsed (defaults to text/vnd.tiddlywiki)
$outputContentType for the output rendering (defaults to text/html, can also be text/plain)
parametersMacro parameters specified as attributes

macros

3 months ago

Macros

4 months ago

Macros are snippets of text that can be inserted with a concise shortcut:

<<myMacro>>

You can write your own Macros in WikiText or for more flexibility you can write JavaScript Macros.

Macros in WikiText

4 days ago

Defining Macros

Macros are snippets of text that can be inserted with a concise shortcut.

Multi-line macros are defined like this:

\define mysamplemacro(name:"Bugs Bunny",address:"Rabbit Hole Hill")
Hi, I'm $name$ and I live in $address$
\end

The first line of the definition specifies the macro name and any parameters. Parameters are named and can optionally have default values that are used if the parameter isn't specified at the time of calling. The body of the macro definition follows, terminated with \end. The macro can include parameters using the $name$ construction.

Single-line macros can omit the \end marker like this:

\define mysamplemacro(name:"Bugs Bunny") Hi, I'm $name$

Macro definitions must be placed at the top of a tiddler. Macros are available to the tiddler that defines them, plus any tiddlers that it transcludes.

Global macros can be defined in any tiddler with the tag $:/tags/Macro. They are then available within all tiddlers.

Macros can be imported from other tiddlers with the ImportVariablesWidget.

JavaScript Macros can also be used for more flexibility.

Using Macros

Macros are used like this:

<<mysamplemacro>>
<<mysamplemacro "Donald Duck">>
<<mysamplemacro "Mickey Mouse" "Mouse House">>

Resulting in:

Hi I'm Bugs Bunny and I live in Rabbit Hole Hill
Hi I'm Donald Duck and I live in Rabbit Hole Hill
Hi I'm Mickey Mouse and I live in Mouse House

Multiline Parameters

Parameters can include line breaks. For example:

<<mysamplemacro "Mickey Mouse" "Mouse House,
Mouse Lane,
Rodentville,
Ratland.">>

By using triple-double quotes you can specify parameter values that include single double quotes. For example:

<<mysamplemacro "Mickey Mouse" "Mouse House,
"Mouse" Lane,
Rodentville,
Ratland.""">>

Make the beds

9 months ago

This is a sample task for the TaskManagementExample

MakeDataUriMacro

5 months ago

The makedatauri macro constructs a data URI from a block of text and an associated ContentType. It is commonly used within stylesheets to generate an inline image or font.

Parameters

PositionNameDescriptionDefault
1sttextText to be converted to a data URI
2ndtypeContentType of text

Examples

A trivial example to show how the macro works:

<<makedatauri "HelloThere" "text/plain">>

data:text/plain,HelloThere

A user-defined macro such as this would typically be used within a stylesheet:

\define datauri(title)
<$macrocall $name="makedatauri" type={{$title$!!type}} text={{$title$}}/>
\end

Then one can write CSS rules like this:

background: url(<<datauri "$:/themes/tiddlywiki/starlight/ltbg.jpg">>);

Making curved text with SVG

3 months ago

This demo shows how to use SVG to render transcluded text along a path. Enter some text in the textbox below to try it out; view the source to see how it is done.

MathJax Plugin by Martin Kantor

2 months ago

An experimental MathJax plugin for TiddlyWiki version 5. As Martin says, the implementation is a bit of a hack but may be useful until we have a better alternative.

Welcome. I have created plugin for TiddlyWiki 5 which allows you to use MathJax (math in TeX and MathML) inside TiddlyWiki 5. It's unofficial plugin and it doesn't follow general policy of TiddlyWiki as stand-alone solution but it works. So you can use it if you want.

MathML

9 months ago

MathML is a markup language for mathematical notation that can be used with HTML.

If your browser supports it, MathML elements can be used in TiddlyWiki5 WikiText just like HTML.

Here is an example MathML equation from the W3C:

<math><mrow><mo>[</mo><mtable><mtr><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd><mtd><mn>0</mn></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr><mtr><mtd><mn>1</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd></mtr></mtable><mo>]</mo></mrow></math>

Renders as:

[010001100]

mechanism

3 months ago

These are the internal mechanisms that fit together to make up TiddlyWiki.

Modules

6 months ago

A module in TiddlyWiki5 is a tiddler containing executable JavaScript, of the type application/javascript and with the field module-type set to the ModuleType of the module.

See the Internals tab of the control panel for lists of the currently loaded modules.

ModuleType

6 months ago

The module-type field of a JavaScript module is a string that identifies the type of the module.

See the Internals tab of the control panel for a list of the module types used in this wiki.

Motovun Jack.jpg

Motovun Jack.pdf

Motovun Jack.svg

MultiTiddlerFiles

MultiTiddlerFiles allow multiple tiddlers to be concisely represented in a single text file.

The goals of this format are:

  • To be easy to type and easy to read
  • Optimised for single line strings
  • To allow common fields or tags to be shared within groups of tiddlers
  • To be simple to process with external tools

MultiTiddlerFiles have the extension multids. The file is structured as a block of shared fields followed by a blank line. The rest of the file is a sequence of comments and tiddlers. Tiddlers are specified by their title, followed by a colon, at least one space character, and then the rest of the line is the text field for the tiddler.

For example:

title: $:/language/ControlPanel/
tags: strings
modifier: JoeBloggs

Basics/Caption: Basics
# This is a comment
Basics/Version: ~TiddlyWiki Version

This example defines two tiddlers, $:/language/ControlPanel/Basics/Caption and $:/language/ControlPanel/Basics/Version.

If a title field is specified in the header then it is treated as a prefix for the individual tiddlers defined in the title.

Naming of System Tiddlers

5 months ago

The system tiddlers provided as part of the core are named according to the following rules:

NamespaceFormatDescription
$:/*CamelCaseRoot user interface tiddlers (eg control panel, advanced search)
$:/config/*CamelCaseUser-oriented configuration setting
$:/core/images/*hyphen-caseCore images
$:/core/modules/*lowercaseJavaScript module tiddlers
$:/core/save/*lowercaseSaving templates for creating TiddlyWiki documents
$:/core/templates/*inconsistentTemplates needed for TiddlyWiki to operate. Currently uses a mix of dashes and periods to separate words
$:/core/ui/*inconsistentTiddlers comprising the default user interface of TiddlyWiki. Currently uses a mix of CamelCase and lowercase naming conventions
$:/core/wiki/*lowercaseMetadata about the entire wiki
$:/docs/*lowercaseDocumentation tiddlers
$:/messages/*CamelCaseSystem messages
$:/plugins/*lowercasePlugin tiddlers, and plugin content
$:/snippets/*inconsistentReusable snippets (will be replaced by macros)
$:/state/*lowercaseUser interface state tiddlers
$:/tags/*CamelCaseUser interface configuration tags (currently $:/tags/stylesheet is inconsistent)
$:/temp/*lowercaseTemporary tiddlers that shouldn't be saved
$:/themes/*lowercaseTheme plugins

The tiddler $:/view is inconsistently named and should be renamed $:/config/View

In the format column:

  • hyphen-case refers to joining multiple lowercase words with hyphens
  • CamelCase refers to joining mulitple initial capitaled words with hyphens
  • lowercase refers to directly joining multiple lowercase words
  • inconsistent marks namespaces that are currently titled inconsistently

NavigatorWidget

3 months ago

Introduction

The navigator widget manipulates the current store, the story list and history lists in response to various WidgetMessages.

Content and Attributes

The navigator widget displays any contained content, and responds to WidgetMessages dispatched within it.

AttributeDescription
storyName of the tiddler containing the story list to be manipulated
historyName of the tiddler containing the history list to be manipulated

Widget Messages

The following WidgetMessages are handled by the navigator widget:

node-webkit

5 months ago

node-webkit is an OpenSource application that fuses the functionality of a web browser with that of Node.js. It makes it possible to use web applications as though they were native apps, with full access to the file system and other native facilities. Learn more from the official site or this introductory blog post.

See TiddlyWiki on node-webkit for details of how to use TiddlyWiki with node-webkit.

Node.js

4 months ago

Node.js is a downloadable application for your PC, Mac or Linux computer that lets it run JavaScript applications. Unlike JavaScript applications running in a web browser, Node.js code has full access to the file system and other resources of the computer, enabling it to perform the roles that have traditionally been the preserve of languages like Java, PHP and Python. See http://nodejs.org for more details.

For TiddlyWiki, Node.js means that we can have a single code base that can run in the browser or on the server, giving great flexibility in how it is used.

For end users, Node.js is no more complicated to install than a web browser, but unlocks powerful capabilities such as the ability to run TiddlyWiki as a web server that you can connect to from other devices.

See TiddlyWiki on Node.js for more details.

Notes for upgrading to 5.0.11-beta

38 days ago

Version 5.0.11-beta includes some changes that can break content from earlier releases of TiddlyWiki 5.

Command line changes

Previously, commands that generate output files would interpret the specified path to the file as being relative to the current working directory. So, for example, the following command would write index.html to the current directory:

tiddlywiki mywiki --rendertiddler $:/core/save/all index.html text/plain

In 5.0.11-beta this behaviour has changed, and now the specified filename is resolved relative to an output folder within the TiddlyWikiFolder. So the command above will now write the file index.html to mywiki/output/index.html.

You can override this behaviour with the OutputCommand. For example, to generate the index.html file within the current directory:

tiddlywiki mywiki --output . --rendertiddler $:/core/save/all index.html text/plain

A further change is that the --rendertiddlers command now clears the output folder before it writes any files. This means that any previous --rendertiddler commands to the same folder will have their output deleted.

Notes for upgrading to 5.0.8-beta

3 months ago

Version 5.0.8-beta includes some changes that can break content from earlier releases of TiddlyWiki 5.

Change to $:/SiteTitle and $:/SiteSubtitle

You should rename any existing SiteTitle and SiteSubtitle tiddlers to $:/SiteTitle and $:/SiteSubtitle respectively.

Changed parsing rules for content of HTML elements

Version 5.0.8-beta marks a change in the way that TiddlyWiki determines whether to parse the content of an HTML element or widget in block mode or inline mode.

  • In block mode, TiddlyWiki parses text into paragraphs, creating <p> tags to wrap them. It also recognises block syntax like headings, lists and tables.
  • In inline mode, TiddlyWiki ignores paragraph formatting, and just recognises character formatting, like bold and italic.

It's important to be able to control which type of parsing is performed for different situations.

Prior to 5.0.8-beta, TiddlyWiki parsed the content of an element in inline mode unless the opening tag of the element were immediately followed by a line break. This meant that much of the time element tags would be shunted together into a long line, hindering readability.

The new behaviour for 5.0.8-beta is to parse the content of an element in inline mode unless the opening tag is immediately followed by two line breaks.

To adjust existing content for 5.0.8-beta you will need to manually add the additional line break after the opening tag of elements and widgets whose content should be parsed in block mode.

The positive aspect of the change is that it removes the need to pack multiple HTML tags onto a single line, improving readability.

Examples

Consider the difference between these two examples. First, here's an HTML tag that starts with two line breaks:

Secondly, here's an HTML tag with just a single line break. Notice how the heading is no longer recognised as a heading

Changed commands for TiddlyWiki on Node.js

The handling of wiki folders has changed. Previously, if the tiddlywiki command was run against a wiki folder that didn't have the necessary tiddlywiki.info file then it would be automatically created. Now, the wiki folder must be initialised with the InitCommand.

This is how to create and start a new server-based wiki:

tiddlywiki mywikifolder --init server
tiddlywiki mywikifolder --server

Note that the name of the clientserver edition has changed to server.

OpenSource

9 months ago

OpenSource is defined by Wikipedia as a philosophy, or pragmatic methodology that promotes free redistribution and access to an end product's design and implementation details.

Osmosoft

7 months ago

Founded in 2004 by JeremyRuston, Osmosoft was originally a consultancy for software services around TiddlyWiki. Notable engagements included working with Socialtext on Socialtext Unplugged.

In 2007, Osmosoft was acquired by BT and became the champions for open source within the enterprise. As part of BT, Osmosoft has worked on a diverse range of projects within BT and for BT's customers.

See http://osmosoft.com/

OutputCommand

60 days ago

Sets the base output directory for subsequent commands. The default output directory is the output subdirectory of the edition directory.

--output <pathname>

If the specified pathname is relative then it is resolved relative to the current working directory.

OXTWIG

3 months ago

The Oxford TiddlyWiki Interest Group meets monthly for discussions and demonstrations about TiddlyWiki.

See https://oxtwig.eventbrite.co.uk/ for details of our next meeting.

We have an email discussion list, too: https://groups.google.com/forum/#!members/oxtwig

OXTWIG #2

The second OXTWIG meeting was held on Thursday 16th January 2014:

OXTWIG #1

The first OXTWIG meeting was held on Thursday 21st November 2013:

packge.json for node-webkit

5 months ago
{
    "name": "tiddlywiki",
    "main": "./index.html",
	"window": {
		"toolbar": true,
		"width": 1024,
		"height": 768
	}
}

Paragraphs in WikiText

6 months ago

To mark the end of a paragraph in TiddlyWiki you need to type enter twice to create a double line break:

This is the first paragraph.

And this is the second paragraph.

Single line breaks are ignored within paragraphs. For example:

For situations where this behaviour isn't convenient, you can also use Hard Linebreaks in WikiText.

ParsingMechanism

7 months ago

Introduction

The parsing mechanism analyses the text of a tiddler against a set of parsing rules, producing a tree representing the structure of the text. The RenderingMechanism is used to transform parse trees into render trees of widget nodes.

TiddlyWiki5 includes ParserModules for several types of tiddler:

  • WikiText
  • Raw HTML
  • Plain text
  • Images (bitmap, SVG and PDF)

The WikiText parser is the most complex, comprising separate individual WikiRuleModules encapsulating each parsing rule.

Parse Trees

The output of parsing a tiddler is an object containing a tree of parse nodes corresponding to the original text. For example:

> JSON.stringify($tw.wiki.parseText("text/vnd.tiddlywiki","Some //italics// and a {{Transclusion}}.").tree)

[
	{type: "element", tag: "p", children: [
		{type: "text", text: "Some "},
		{type: "element", tag: "em", children: [
			{type: "text", text: "italics"}
		]},
		{type: "text", text: " and a "},
		{type: "tiddler", attributes:{
			tiddler: {type: "string", value: "Transclusion"}
		}, children:[
			{type: "transclude", attributes:{
				tiddler: {type: "string", value: "Transclusion"}
			}}
		]},
		{type: "text", text: "."}
	]}
]

Parse tree nodes are plain JavaScript objects, and do not have a prototype.

PasswordCommand

Set a password for subsequent crypto operations

--password <password>

PasswordWidget

7 months ago

Introduction

The password widget displays a password input box that is bound to a named entry in the TiddlyWiki5 PasswordVault. Passwords are currently stored in the browsers local storage and are not themselves encrypted.

Content and Attributes

The content of the <$password> widget is ignored.

AttributeDescription
nameName of the password vault entry

PermaLinks

52 days ago

Permalinks allow direct links to individual tiddlers within a TiddlyWiki.

Simple Permalinks

The simplest form of permalink is a single target tiddler title appended to the base URL with #:

http://tiddlywiki.com/#HelloThere

The tiddler title can contain spaces if required:

http://tiddlywiki.com/#Using TiddlyWiki on Node.js

Note that double square brackets are not required around the target tiddler title; however, if present they are silently removed.

Story Permalinks

The permalink can also specify the story list of tiddlers that should be opened alongside the target tiddler as a TiddlerFilter:

http://tiddlywiki.com/#TiddlerFields:Tiddlers TiddlerTags TiddlerFields ContentType

If the target tiddler isn't present in the story list then it is automatically inserted at the top. This means that the following two examples both target the tiddler Tiddlers within the story sequence Tiddlers, Tags, TiddlerFields:

http://tiddlywiki.com/#Tiddlers:Tags TiddlerFields

http://tiddlywiki.com/#Tiddlers:Tiddlers Tags TiddlerFields

It is also possible to specify a story filter without specifying a target tiddler for navigation:

http://tiddlywiki.com/#:[tags[task]]

About URL encoding

There are technical restrictions on the legal characters in an URL fragment. To allow all tiddler titles to be addressed, illegal characters are subject to a process called "URL encoding" whereby problematic characters are replaced by their numeric code. For example, the space character is replaced with %20.

Both the target tiddler title and the story filter should be URL encoded (but not the separating colon). TiddlyWiki generates properly encoded URLs which can look quite ugly. However, in practice browsers will usually perfectly happily process arbitrary characters in URL fragments. Thus when creating permalinks manually you can choose to ignore URL encoding.

Permalink Behaviour

Two important aspects of TiddlyWiki's behaviour with permalinks can be controlled via options in the $:/ControlPanel Advanced/Settings tab:

  • Whether to automatically update the address bar at each navigation, and if so whether to include the story sequence as well as the target tiddler
  • Whether the updates to the address bar should affect browser history. The default is no; when switched to yes you can rewind navigation between tiddlers using the browser back and forward buttons

Note that typing or navigating to a permalink will always cause the permalink to be processed, and tiddlers opened and closed as appropriate.

Technical Details

When TiddlyWiki starts up it processes permalinks according to the following steps; the same steps are repeated if the permalink changes dynamically (this happens in response to the user editing the address bar, for example).

  1. If the permalink contains a colon, treat the string before as the target and the string after it as the story filter
  2. If the permalink doesn't contain a colon, treat the entire string as the target and mark the story filter as unspecified
  3. If the story filter was unspecified and we're in the process of starting up, then set the story filter to the empty string if the target is specified, or to the default tiddlers if the target is unspecified
  4. If the story filter was unspecified and we're not starting up, then set the story filter to the current story list
  5. Evaluate the story filter as the story list
  6. If the target is specified and not present in the story list then add it at the top
  7. If the target is specified then navigate to it, otherwise navigate to the first tiddler in the story list

Philosophy of Tiddlers

6 months ago

TiddlyWiki is an opinionated tool, but the opinions are in the domain of philosophy rather than of implementation, where it is infinitely customisable.

The purpose of recording and organising information is so that it can be used again. The value of recorded information is directly proportional to the ease with which it can be re-used.

The philosophy of tiddlers is that we do this by slicing information up into the smallest semantically meaningful units with rich modelling of relationships between them. Then we use aggregation and composition to weave the fragments together to present narrative stories.

TiddlyWiki aspires to provide an algebra for tiddlers, a concise way of expressing and exploring the relationships between items of information.

PluginMechanism

6 months ago

Plugins are bundles of tiddlers that are distributed and managed as a single unit by being packed into a single JSON tiddler. If a tiddler isn't found in the main store, then the registered plugins are searched for it instead.

Tiddlers within plugins behave something like shadow tiddlers in classic TiddlyWiki: they can be freely overwritten by creating a tiddler with the same title, but deleting that tiddler restores the underlying tiddler value from the plugin.

Plugins have a plugin-type field that may be:

  • plugin (default) - a plain plugin
  • theme - a theme plugin (see ThemeMechanism)

Plugins can be used to package ordinary content, or can include JavaScript modules that extend and enhance the core TiddlyWiki5 functionality.

Plugins conventionally have a title of the form $:/plugins/publisher/name. Plugins that are part of the core TiddlyWiki distribution have titles of the form $:/plugins/tiddlywiki/name.

Plugins that define macros, views or other named entities are expected to prefix the name with their publisher identifier, for example: tiddlytools.slider.

Plugin fields

Plugins are stored as tiddlers with the following fields:

FieldDescription
titleTitle of plugin
descriptionDescription of plugin
authorAuthor of plugin
versionVersion string (must conform to SemanticVersioning convention)
sourceSource URL of plugin
typeMust be application/json
plugin-typeCan be plugin (default) or theme
textJSON encoding of the list of tiddlers comprising the plugin
dependentsList of dependent plugins (currently only implemented for themes)

Plugin folders

On the server, plugins can be stored as ordinary JSON tiddlers but it is often more convenient to store them as separate tiddler files within folders. Plugin folders must contain a plugin.info file that contains the metadata for the plugin. It can also optionally identify files external to the plugin folder that should be loaded as tiddlers.

The plugin.info file should contain the following JSON structure:

The JSON structure for plugin tiddlers is as follows:

{
	"title": "$:/plugins/publisher/name",
	"description": "An exemplary plugin for demonstration purposes",
	"author": "JeremyRuston",
	"version": "1.2.3-alpha3",
	"core-version": ">=5.0.0",
	"source": "http://tiddlywiki.com/MyPlugin",
	"plugin-type": "plugin"
}

By convention, the titles of the individual tiddlers are prefixed with the title of the containing plugin, but they are not restricted to do so.

Note that if the version field is omitted from a plugin.info file when the plugin folder is packed then it is automatically filled in by the core to the current core version number. This is to ensure that all the core plugins carry the correct version number. Generally plugin authors will want to ensure that they do explicitly specify a version number.

Plugin library

The standard distribution of TiddlyWiki includes a number of standard plugins in the plugins directory.

Including plugins in a wiki

To be usable in the browser, plugins just need to be included in the wiki. For wikis that are generated on the server, TiddlyWikiFolders can contain a tiddlywiki.info file that identifies the plugins to be included in this wiki:

{
	"plugins": [
		"tiddlywiki/slider",
		"tiddlytools/chooser"
	]
}

Plugins names refer to plugin folders listed in TiddlyWiki5's root plugins folder.

Plugins can also be included manually by copying them into the plugins subfolder of the wiki.

Plugin processing

The wiki object keeps track of all of the currently loaded plugins. If a request for a tiddler isn't in the store then the wiki looks through the cascade of plugins to find the requested tiddler. It is a similar idea to the way that shadow tiddlers are implemented in classic TiddlyWiki.

In the browser, any constituent tiddlers that are JavaScript modules (ie shadow tiddlers of content type application/javascript and possessing the field module-type) are executed during startup processing.

Plugins

10 months ago

A plugin in TiddlyWiki5 is a bundle of tiddlers packaged together as a single tiddler. Plugins are used to distribute optional, custom components for TiddlyWiki.

The tiddlers within a plugin appear as ShadowTiddlers.

Plugins can contain JavaScript modules, style sheets, and templates to extend the functionality of TiddlyWiki itself. Plugins can also be used to distribute ordinary text, images or other content. Plugins can be updated from their source as a unit.

See the PluginMechanism discussion for more details about how plugins are implemented internally.

PopupMechanism

6 months ago

The popup mechanism allows blocks of content to be selectively displayed and positioned with respect to an anchor. It has several parts:

  • StateTiddlers to record whether a popup is currently displayed or not
  • The RevealWidget to selectively display the popup content
  • The ButtonWidget to trigger the display of the popup by setting the state tiddler appropriately

Preserving open tiddlers at startup

5 months ago

Ordinarily, at startup TiddlyWiki displays the tiddlers specified as a filter in the tiddler $:/DefaultTiddlers.

Sometimes it's useful to re-open the same tiddlers that were open when the file was saved. To do so, set $:/DefaultTiddlers to this filter:

[list[$:/StoryList]]

This filter returns the tiddlers specified in the $:/StoryList tiddler, which is the system tiddler that TiddlyWiki uses to store the sequence of tiddlers in the current story.

QualifyMacro

5 months ago

The qualify macro is part of the StateMechanism. Given a base tiddler title it generates a unique string that includes a hashed encoding of a position within the widget render tree, identified by the stack of transcluded tiddlers that leads to that position.

Parameters

PositionNameDescriptionDefault
1sttitleBase tiddler title

Examples

The results returned by the qualify macro will depend upon where it is used. For example:

<<qualify "base">>

Returns:

base-{-370603839}

Quine

Wikipedia defines a Quine as a computer program which takes no input and produces a copy of its own source code as its only output.

TiddlyWiki is an unusual example of a practical quine: it is this ability to produce a copy of its own source code that lies at the heart of TiddlyWiki's ability to independently save changes to itself.

RadioWidget

6 months ago

Introduction

The radio widget displays an HTML <input type="radio"> that reflects whether a given tiddler field has a specified value. Selecting the radio button sets to the tiddler field to the value.

Content and Attributes

The content of the <$radio> widget is displayed within an HTML <label> element also containing the radio button. This means that clicking on the content will have the same effect as clicking on the button itself.

AttributeDescription
tiddlerTitle of the tiddler to manipulate (defaults to the WidgetVariable: currentTiddler)
fieldThe name of the field to which the radio button will be bound
valueThe value for the tiddler field
classCSS classes to be assigned to the label around the radio button

Example

This example uses the radio widget to change the modifier field of this tiddler:

<$radio field="modifier" value="JoeBloggs"> Joe Bloggs</$radio>

<$radio field="modifier" value="JaneBloggs"> Jane Bloggs</$radio>

It renders as:

ReadMe

6 months ago

Welcome to TiddlyWiki

Welcome to TiddlyWiki, a complete interactive wiki in JavaScript. It can be used as a single HTML file in the browser or as a powerful Node.js application. It is highly customisable: the entire user interface is itself implemented in hackable WikiText.

This is version 5.0.13-beta of TiddlyWiki, a major reboot designed for the next 25 years. It is currently in beta (see the detailed ReleaseHistory). There is a RoadMap for moving to the full release. It is a great time to get involved and support the future development of TiddlyWiki.

TiddlyWiki is a free, open source project that depends on your love and support for its survival.

TiddlyWikiClassic - http://classic.tiddlywiki.com

On this site, unless noted otherwise, "TiddlyWiki" refers to the new version 5, and "TiddlyWikiClassic" is used to identify the older version.

The deep internal improvements mean that the new version of TiddlyWiki is not fully compatible with TiddlyWikiClassic. Existing content will need massaging, while plugins and themes will have to be completely rewritten. The upgrade path will get smoother as the new version matures.

Getting started with TiddlyWiki under Node.js

Running TiddlyWiki on Node.js brings several important benefits over and above the single file version:

  • You can edit your content on any suitably compatible HTML5 browser, including smartphones and tablets
  • Individual tiddlers are stored in separate files, which you can organise as you wish
  • The ability to build multiple wikis that blend different combinations of shared and unique content

Installation

  1. Install Node.js from http://nodejs.org
  2. Open a command line terminal and type:

    npm install -g tiddlywiki

    If it fails with an error you may need to re-run the command as an administrator:

    npm install -g tiddlywiki (Windows)

    sudo npm install -g tiddlywiki (Mac/Linux)

  3. Check TiddlyWiki is installed by typing:

    tiddlywiki --version

  4. In response, you should see TiddlyWiki report its current version (eg 5.0.8-beta; you may also see other debugging information reported)
  5. Try it out:
    1. tiddlywiki mynewwiki --init server to create a folder for a new wiki that includes server-related components
    2. tiddlywiki mynewwiki --server to start TiddlyWiki
    3. Visit http://127.0.0.1:8080/ in your browser
    4. Try editing and creating tiddlers

The -g flag causes TiddlyWiki to be installed globally. Without it, TiddlyWiki will only be available in the directory where you installed it.

A slightly different method for installation is recommended if you plan on forking the source code in order to study it or contribute to it. See Working with the TiddlyWiki5 repository.

Usage

TiddlyWiki5 can be used on the command line to perform an extensive set of operations based on TiddlyWikiFolders, TiddlerFiles and TiddlyWikiFiles.

For example, the following command loads the tiddlers from a TiddlyWiki HTML file and then saves one of them in static HTML:

tiddlywiki --verbose --load mywiki.html --rendertiddler ReadMe ./readme.html

Running tiddlywiki from the command line boots the TiddlyWiki kernel, loads the core plugins and establishes an empty wiki store. It then sequentially processes the command line arguments from left to right. The arguments are separated with spaces.

The first argument is the optional path to the TiddlyWikiFolder to be loaded. If not present, then the current directory is used.

The commands and their individual arguments follow, each command being identified by the prefix --.

tiddlywiki [<wikipath>] [--<command> [<arg>[,<arg>]]]

The available commands are:

See also:

Upgrading

If you've installed TiddlyWiki on Node.js on the usual way, when a new version is released you can upgrade it with this command:

npm update -g tiddlywiki

On Mac or Linux you'll need to add sudo like this:

sudo npm update -g tiddlywiki

Working with the TiddlyWiki5 repository

Setting Up

If you plan on working with the TiddlyWiki5 source code then follow these steps:

  1. Fork the TiddlyWiki5 GitHub repository from https://github.com/Jermolene/TiddlyWiki5
  2. Clone a local copy of your fork
  3. Open a command line terminal and change the current working directory to the root of the repo
  4. Type npm link (Windows) or sudo npm link (Mac/Linux) to tell npm to use this copy of the repo as the globally installed one

After this procedure you can work with TiddlyWiki5 via npm as though it were installed in the usual way with npm install -g tiddlywiki.

See also Scripts for TiddlyWiki on Node.js.

This readme file was automatically generated by TiddlyWiki

Release 5.0.0-alpha.11

7 months ago

This release is the culmination of a large scale refactoring of the widget mechanism of TiddlyWiki5. There are several changes to be aware of if upgrading from earlier versions:

  • The following widgets have been removed:
    • <$setstyle> - use <div style=<<macroName Param>>> instead
    • <$video> - will return in a later release
    • <$datauri> - use the <<makedatauri>> built-in macro instead
    • <$error> - may return in a later release
    • <$import> - use the BrowseWidget, DropzoneWidget and NavigatorWidget instead
    • <$info> - use the <<changecount>> built-in macro instead
    • <$version> - use the <<version>> built-in macro instead
  • The following widgets have had significant changes:
    • EditWidget
    • ListWidget - the list widget itself no longer generates HTML nodes, so you'll often need to wrap the template in a <div> or a <span> to be able to style the content
    • ViewWidget - has several changes:
      • <$view format="link"/> is no longer available; use an explicit <$link> widget instead
      • <$view format="link"/> is no longer available; use the TranscludeWidget instead
  • The following new widgets have been added:
  • Widget attribute names have been made more consistent. In particular, tiddler is used to reference a tiddler by title, not title
  • It is no longer possible to import the macro definitions within another tiddler by transcluding that tiddler
  • The body element now has the class tw-body, which will need to be specified in any overrides
    • This was done due to the new support for HTML foreign objects, which makes it possible to have multiple <body> elements in a document

Release 5.0.0-alpha.12

7 months ago

See GitHub for detailed change history of this release

This minor release just contains fixes for the syncer and related adaptor modules for the TiddlyWeb edition and for TiddlyWiki5's integrated server.

Release 5.0.0-alpha.13

7 months ago

See GitHub for detailed change history of this release

This release has several bug fixes:

  • Fixes to DaveGifford's themes blanca, blue and rocker
  • Fix an issue with the <$edit-text> widget
  • Documentation updates
  • Improved deployment scripts
  • Made the modifier field in the subtitle be a link
  • Styling improvements for the CodeMirror plugin
  • Improved the ViewWidget so that it falls back to displaying its content if the field/property is missing or empty
  • Extend use of the built-in <<tabs>> macro to the tiddler info panel, the control panel and the sidebar
    • This means that you can add new tabs by creating tiddlers with these tags, and optionally a caption field for the text of the tab:

Release 5.0.0-alpha.14

7 months ago

See GitHub for detailed change history of this release

This release has several bug fixes:

  • Improved the layout of the control panel
  • Fixed problem with using the CheckboxWidget to apply tags to tiddlers that don't have any existing tags
  • Fixed problem with default password for the PasswordWidget being the string "null"

Release 5.0.0-alpha.15

7 months ago

See GitHub for detailed change history of this release

New Features

  • Added a dropdown to the edit template for setting the tiddler type
  • A saver module for Microsoft Internet Explorer version 10 and above. Clicking save in the sidebar causes the browser to pull up a bar at the bottom of the window where you can click save. You then get a new copy of your wiki in the downloads folder.
  • Support for new tw-close-other-tiddlers message (eg, )
  • For http://five.tiddlywiki.com, add a tiddler info tab with a link to the static representation of the tiddler
  • Make more UI elements extensible via system tags:

Improvements

  • Rename the <$setvariable> to <$set>
    • <$setvariable> will temporarily remain as a synonym for <$set> for the next few releases
  • Improve the popup mechanism so that the tiddler info panel doesn't close so easily
  • Various improvements for working with TiddlyWeb, including:
    • Updated control panel

Bug fixes

  • Fixed bug when creating a tiddler title starting or ending with a space
  • Fixed behaviour of tags editor dropdown when search box is empty
  • Fixed problem with interpretation of fields and index attributes of the TranscludeWidget
  • Fixed the module type names in the internal tab of the control panel
  • Improved styling for embedded PDFs
  • Fixed bug with second being omitted from serialised date formats

Contributors to this release include @jermolene and @grayeul.

Release 5.0.0-alpha.16

6 months ago

See GitHub for detailed change history of this release

New Features and Improvements

  • Improved appearance of tags editor
  • Improved generation of qualified tiddler titles for state storage
    • Instead of $:/state/tab/sidebar-{$:/core/ui/SideBar|$:/core/ui/SideBar||}{$:/core/ui/PageTemplate|$:/core/ui/PageTemplate||} one gets $:/state/tab/sidebar-{1743827719}
  • Significant updates to the structure and content of the user documentation
  • Added a new plugin for displaying corner ribbons; currently used for a version banner on tw5.com
  • Split Snow White theme into a base Vanilla theme with all the basic formatting, leaving the decorative bits to Snow White
    • Existing TiddlyWikiFolders will need updating to include Vanilla as an additional theme
  • The page building blocks are now driven by the system tag $:/tags/PageTemplate
  • Fixed problem that prevented tag configured items from shadow tiddlers interleaving with items from ordinary tiddlers
  • Refactored control panel to add Saving tab that includes TiddlySpot options
  • Improved notifications when saving to TiddlySpot
  • Added backup URL to TiddlySpot control panel tab
  • Extended the ServerCommand to add primitive support for basic authentication when running under Node.js

Bug fixes

  • Fixed problem with displaying tiddler titles that contain WikiText syntax
  • No longer crashes when encountering an error in a filter string
  • Fixed a crash when dragging and dropping tiddlers within TiddlyWiki5
  • No longer update the modified date for imported tiddlers
  • Automatically forces new field names to be lower case

Internal changes

  • Added Windows-compatible build scripts
  • Changes to the SavingMechanism to allow the tiddlers that are saved to be selected
  • The main HTML file template used for saving TiddlyWiki5 documents has changed from $:/core/templates/tiddlywiki5.template.html to $:/core/save/all
  • Moved tw5.com's Google Analytics integration into a proper plugin

Contributors to this release include @jermolene, @asampal and @pmario.

Release 5.0.0-alpha.17

6 months ago

See GitHub for detailed change history of this release

Bug fixes

  • Fixes a small but important bug that prevented downloading an empty wiki with alpha.16

Release 5.0.1-alpha

6 months ago

See GitHub for detailed change history of this release

Improvements

  • Changes to the importing process to enable a smoother Upgrading process
    • Ignores attempts to import plugins that are older than currently installed plugins
    • System tiddlers are now imported as usual
  • If $:/theme isn't defined or refers to a missing tiddler, then fallback through Snow White to Vanilla. This means that empty.html now defaults to Snow White
  • Added support for Block Quotes in WikiText

Bug fixes

  • Fixed bug that was preventing $:/tags/PageControls tiddlers from being reordered

Internal changes

Release 5.0.10-beta

2 months ago

See GitHub for detailed change history of this release

Highlights

Documentation Improvements

Usability Improvements

  • Refactor sorting to respect accented characters
  • Support embedded images in Markdown tiddlers
  • Refactored sidebar hiding action so that the story river border is maintained

Hackability Improvements

Bug Fixes

  • Added support for saving changes on Windows network drives
  • Refactored configuration processing so that ordinary tiddlers are processed after shadow tiddlers. This resolves an issue whereby user stylesheets were being overridden by shadow stylesheets
  • Fixed issue with offline snapshot of server edition erroneously including shadow tiddlers
  • Fixed problem with corrupted upgrades from 5.0.x-prerelease to 5.0.x-beta
  • Fixed bug with [untagged[]] filter operator
  • Fixed incorrect background colour for tag pills in the sidebar
  • Fixed issues with null fields under TiddlyWeb
  • Fixed problem with hamburger overlapping scrollbars

Release 5.0.11-beta

38 days ago

See GitHub for detailed change history of this release

Incompatible Changes

See Notes for upgrading to 5.0.11-beta for more details of these changes:

  • The default output location for command line operations has changed to the /output folder within TiddlyWikiFolders (it used to be current directory)
  • Note that the shadow tiddler $:/core/ui/PageMacros has changed with this release. If you've made modifications to it you should copy your modifications to a new tiddler, delete $:/core/ui/PageMacros, perform the upgrade and then manually update the new copy of $:/core/ui/PageMacros

Documentation Improvements

Usability Improvements

  • Many performance optimisations, particularly for filter operations
  • Added support for PermaLinks and browser back and forward buttons
  • Added support for WikiLinks in Markdown via [link text](#TiddlerTitle)
  • Added support for explicit external Linking in WikiText (eg [ext[tooltip|url]])
  • Replaced hamburger menu icon with double chevron icon
  • Enhance plain text parsing to use the CodeBlockWidget, and hence use syntax highlighting if the plugin is installed. This gives us syntax highlighting for JavaScript shadow tiddlers, amongst other things
  • Improvements to the German, French, Italian, Japanese and Chinese translations
  • Removed WikiText tiddlers from the sidebar "Types" tab
  • Added various warnings when editing shadow tiddlers
  • Allow digits in field names
  • Added warning banner and when attempting to edit binary tiddlers
  • Added automatic refreshing of the browser window title from $:/core/wiki/title

Hackability Improvements

Bug Fixes

  • Fixed issue with hovering of the topbar icons in Firefox
  • Fixed problem with dragging and dropping within a text edit control

Contributors

I (@Jermolene) would like to thank the contributors to this release who have generously given their time to helping improve TiddlyWiki:

@BramChen, @mwfogleman, @nameanyone, @natecain, @pekopeko1, @pmario, @sukima, @xcazin.

Release 5.0.12-beta

38 days ago

See GitHub for detailed change history of this release

This is an emergency release that fixes a single significant bug with shadow tiddler handling in 5.0.11. See the discussion thread for more details.

Release 5.0.13-beta

108 seconds ago

See GitHub for detailed change history of this release

Accessibility Improvements

This release includes a number of features designed to improve the experience of TiddlyWiki with a screen reader. Particular thanks to @domasofan for his feedback

  • Added label and title for show/hide sidebar buttons
  • Added label and title for advanced search link
  • Added label and title for close buttons in "Open" sidebar tab
  • Added aria-label support to the LinkWidget
  • Switched to H1 tags for the page title and H2 tags for tiddler titles
  • Added label and title for tiddler and page toolbar buttons

Usability Improvements

Hackability Improvements

Bug Fixes

  • Fixed here and here the problem with state tiddlers being inadvertently saved
  • Fixed bug with TextWidget not refreshing correctly
  • Fixed problem with vertical tabs in Safari
  • Fixed issue with images in Markdown

Contributors

@Jermolene would like to thank the contributors to this release who have generously given their time to help improve TiddlyWiki:

Release 5.0.2-beta

6 months ago

See GitHub for detailed change history of this release

Improvements

Bug fixes

  • Fixed problem deleting tiddlers under the filesystemadaptor
  • Fixed problem with transcluding fields containing lists or dates (eg, {{!!tags}})
  • Fixed problem with re-ordering page control tiddlers (ie tiddlers tagged $:/tags/PageControls)
  • Update template used for deploying to TiddlyWeb
  • Fixed problem with tiddler deletions via the file system adaptor

Internal changes

Release 5.0.3-beta

6 months ago

See GitHub for detailed change history of this release

This release includes minor bug fixes and documentation updates.

Release 5.0.4-beta

6 months ago

See GitHub for detailed change history of this release

Improvements

  • Switched to using an HTML5 placeholder for the default text of a new tiddler
  • Refactored stylesheet handling so that theme tweaks are now applied immediately, and some ordering issues have been resolved
  • Several improvements for running TiddlyWiki on Node.js:
    • The tiddlywiki.info file in the root of wiki folder file is now optional, falling back to a default configuration suitable for serverside use (commit)
    • The file system plugin now automatically creates the tiddlers subfolder in the wiki folder
  • Added favicon.ico support
  • Added SaveTiddlerCommand

Bug Fixes

  • Fixed problem with tiddlers sometimes wrongly opening at the top of the story (commit)
  • Fixed problem with refreshing RadioWidget
  • Fixed problem with the dragger image being visible in some circumstances
  • Fixed drag and drop support on InternetExplorer, contributed by DavidJade (@davidjade on GitHub)
  • Fixed crash on modifying page template (commit)
  • Updated fullscreen plugin to latest version of the API (commit)
  • Improved handling of double square brackets within tags (thanks to StephanHradek)

This release includes minor bug fixes and documentation updates.

Release 5.0.5-beta

5 months ago

See GitHub for detailed change history of this release

Improvements

Bug Fixes

  • Fixed problem with modal wizard positioning on narrow screens
  • Fix problem with static content being included in empty.html when downloaded from the full wiki
  • Improved performance of tiddler import with large tiddlers on Firefox

Release 5.0.6-beta

5 months ago

See GitHub for detailed change history of this release

Improvements

Bug Fixes

  • Fixed import browse button
  • Fixed crash when attempting full screen mode on browsers that don't support it
  • Fixed requirement for a newline immediately after a horizontal rule, table or typed block (thanks to StephanHradek)
  • Fixed problem with placeholder attibute on InternetExplorer (thanks to DavidJade)

Release 5.0.7-beta

4 months ago

See GitHub for detailed change history of this release

Incompatible Changes

These are changes that might affect users upgrading from previous betas.

Documentation updates

Improvements

Bug Fixes

  • Fixed problem with default format of ViewWidget substituting seconds for minutes in displayed times
  • Fixed problem that was causing several animations to fail in Safari
  • Fixed problem with unclickable sidebar under the Centralised theme
  • Fixed problem with non-system tiddlers showing up in system tiddler advanced search
  • Fixed problem with notifications not always disappearing in Firefox
  • Fixed problem with wiki folders including wiki files with tiddlers that do not have a title
  • Fixed problem with ServerCommand logging "Serving on undefined:8080"

Release 5.0.8-beta

3 months ago

See GitHub for detailed change history of this release

Incompatible Changes

See Notes for upgrading to 5.0.8-beta for more details of these changes:

Documentation Improvements

Usability Improvements

  • Added automatic saving on editing a tiddler and a warning when attempting to close the window with unsaved changes
  • Added confirmation dialogue when deleting tiddlers
  • Add support for switchable (and editable) ColourPalettes
  • Added TranslationMechanism and translations for:
    • Deutsch (Österreich and Deutschland) by @pmario
    • Français (France) by @xcazin
    • Chinese (Simplified and Traditional) by @BramChen
  • Add error alerts when syncing to a server
  • Rejigged $:/ControlPanel to use nested tabs
  • Added $:/TagManager for easy management of tags
  • Added experimental KeyboardWidget, including support for ctrl-enter (or cmd-enter) to finish editing a tiddler
  • Added number of tags to control panel Basics tab
  • Enhanced link handling so that control/command clicking a link opens the target tiddler without navigating to it
  • Importing tiddlers via drag and drop no longer opens all the tiddlers

Scalability Improvements

Hackability Improvements

Bug Fixes

  • Fixed problem with pasting items into the browser
  • Fixed problem with colour pickers not showing correct colour in Chrome
  • Fixed problem with tag pills not working inside table cells
  • Fixed problem in client server configuration with % in tiddler titles
  • Fixed problem with not using placeholder text when editing missing tiddlers
  • Fixed problem with test data in certain time zones
  • Fixed problem with non-breaking space characters being converted into '@' symbols
  • Fixed problem with highlighting plugin only working in the browser
  • Fixed crash when wiki/themes folder contains files that are not themes

Release 5.0.9-beta

3 months ago

See GitHub for detailed change history of this release

Highlights

Documentation Improvements

Usability Improvements

  • Made the dropdown arrow icon skinnier
  • Added validation of legal characters for fieldnames
  • Added blacklisting of unsafe HTML elements and attributes
  • Added a warning indicator to tiddlers in TiddlyWikiClassic format
  • Add tiddler info Advanced panel with information about plugins and shadow tiddlers
  • Improved layout of $:/ControlPanel Plugins tab
  • Enhance viewing of system tiddlers by fading down the $:/ prefix
  • Extend $:/TagManager to allow icons to be assigned to tags
  • Added support for list-before and list-after fields for controlling tag ordering (see TiddlerTags for details)
  • Added request for confirmation before abandoning edits to a tiddler

Hackability Improvements

Bug Fixes

  • Fixed problem with occasional freezes of the sync mechanism - thanks to buggyj
  • Fixed problem with tiddlers or fields called __proto__
  • Fixed with refreshing the D3 plugin
  • Fixed problem with "null" message when unloading under Internet Explorer 11

ReleaseHistory

5 months ago

Here are the details of recent releases of TiddlyWiki5. See TiddlyWiki5 Versioning for details of how releases are named.

Release 5.0.13-beta

Release date: 24th June 2014 at 10:41

See GitHub for detailed change history of this release

Accessibility Improvements

This release includes a number of features designed to improve the experience of TiddlyWiki with a screen reader. Particular thanks to @domasofan for his feedback

  • Added label and title for show/hide sidebar buttons
  • Added label and title for advanced search link
  • Added label and title for close buttons in "Open" sidebar tab
  • Added aria-label support to the LinkWidget
  • Switched to H1 tags for the page title and H2 tags for tiddler titles
  • Added label and title for tiddler and page toolbar buttons

Usability Improvements

Hackability Improvements

Bug Fixes

  • Fixed here and here the problem with state tiddlers being inadvertently saved
  • Fixed bug with TextWidget not refreshing correctly
  • Fixed problem with vertical tabs in Safari
  • Fixed issue with images in Markdown

Contributors

@Jermolene would like to thank the contributors to this release who have generously given their time to help improve TiddlyWiki:

Release 5.0.12-beta

Release date: 17th May 2014 at 02:02

See GitHub for detailed change history of this release

This is an emergency release that fixes a single significant bug with shadow tiddler handling in 5.0.11. See the discussion thread for more details.

Release 5.0.11-beta

Release date: 16th May 2014 at 17:00

See GitHub for detailed change history of this release

Incompatible Changes

See Notes for upgrading to 5.0.11-beta for more details of these changes:

  • The default output location for command line operations has changed to the /output folder within TiddlyWikiFolders (it used to be current directory)
  • Note that the shadow tiddler $:/core/ui/PageMacros has changed with this release. If you've made modifications to it you should copy your modifications to a new tiddler, delete $:/core/ui/PageMacros, perform the upgrade and then manually update the new copy of $:/core/ui/PageMacros

Documentation Improvements

Usability Improvements

  • Many performance optimisations, particularly for filter operations
  • Added support for PermaLinks and browser back and forward buttons
  • Added support for WikiLinks in Markdown via [link text](#TiddlerTitle)
  • Added support for explicit external Linking in WikiText (eg [ext[tooltip|url]])
  • Replaced hamburger menu icon with double chevron icon
  • Enhance plain text parsing to use the CodeBlockWidget, and hence use syntax highlighting if the plugin is installed. This gives us syntax highlighting for JavaScript shadow tiddlers, amongst other things
  • Improvements to the German, French, Italian, Japanese and Chinese translations
  • Removed WikiText tiddlers from the sidebar "Types" tab
  • Added various warnings when editing shadow tiddlers
  • Allow digits in field names
  • Added warning banner and when attempting to edit binary tiddlers
  • Added automatic refreshing of the browser window title from $:/core/wiki/title

Hackability Improvements

Bug Fixes

  • Fixed issue with hovering of the topbar icons in Firefox
  • Fixed problem with dragging and dropping within a text edit control

Contributors

I (@Jermolene) would like to thank the contributors to this release who have generously given their time to helping improve TiddlyWiki:

@BramChen, @mwfogleman, @nameanyone, @natecain, @pekopeko1, @pmario, @sukima, @xcazin.

Release 5.0.10-beta

Release date: 19th April 2014 at 14:05

See GitHub for detailed change history of this release

Highlights

Documentation Improvements

Usability Improvements

  • Refactor sorting to respect accented characters
  • Support embedded images in Markdown tiddlers
  • Refactored sidebar hiding action so that the story river border is maintained

Hackability Improvements

Bug Fixes

  • Added support for saving changes on Windows network drives
  • Refactored configuration processing so that ordinary tiddlers are processed after shadow tiddlers. This resolves an issue whereby user stylesheets were being overridden by shadow stylesheets
  • Fixed issue with offline snapshot of server edition erroneously including shadow tiddlers
  • Fixed problem with corrupted upgrades from 5.0.x-prerelease to 5.0.x-beta
  • Fixed bug with [untagged[]] filter operator
  • Fixed incorrect background colour for tag pills in the sidebar
  • Fixed issues with null fields under TiddlyWeb
  • Fixed problem with hamburger overlapping scrollbars

Release 5.0.9-beta

Release date: 15th April 2014 at 22:39

See GitHub for detailed change history of this release

Highlights

Documentation Improvements

Usability Improvements

  • Made the dropdown arrow icon skinnier
  • Added validation of legal characters for fieldnames
  • Added blacklisting of unsafe HTML elements and attributes
  • Added a warning indicator to tiddlers in TiddlyWikiClassic format
  • Add tiddler info Advanced panel with information about plugins and shadow tiddlers
  • Improved layout of $:/ControlPanel Plugins tab
  • Enhance viewing of system tiddlers by fading down the $:/ prefix
  • Extend $:/TagManager to allow icons to be assigned to tags
  • Added support for list-before and list-after fields for controlling tag ordering (see TiddlerTags for details)
  • Added request for confirmation before abandoning edits to a tiddler

Hackability Improvements

Bug Fixes

  • Fixed problem with occasional freezes of the sync mechanism - thanks to buggyj
  • Fixed problem with tiddlers or fields called __proto__
  • Fixed with refreshing the D3 plugin
  • Fixed problem with "null" message when unloading under Internet Explorer 11

Release 5.0.8-beta

Release date: 28th February 2014 at 15:51

See GitHub for detailed change history of this release

Incompatible Changes

See Notes for upgrading to 5.0.8-beta for more details of these changes:

Documentation Improvements

Usability Improvements

  • Added automatic saving on editing a tiddler and a warning when attempting to close the window with unsaved changes
  • Added confirmation dialogue when deleting tiddlers
  • Add support for switchable (and editable) ColourPalettes
  • Added TranslationMechanism and translations for:
    • Deutsch (Österreich and Deutschland) by @pmario
    • Français (France) by @xcazin
    • Chinese (Simplified and Traditional) by @BramChen
  • Add error alerts when syncing to a server
  • Rejigged $:/ControlPanel to use nested tabs
  • Added $:/TagManager for easy management of tags
  • Added experimental KeyboardWidget, including support for ctrl-enter (or cmd-enter) to finish editing a tiddler
  • Added number of tags to control panel Basics tab
  • Enhanced link handling so that control/command clicking a link opens the target tiddler without navigating to it
  • Importing tiddlers via drag and drop no longer opens all the tiddlers

Scalability Improvements

Hackability Improvements

Bug Fixes

  • Fixed problem with pasting items into the browser
  • Fixed problem with colour pickers not showing correct colour in Chrome
  • Fixed problem with tag pills not working inside table cells
  • Fixed problem in client server configuration with % in tiddler titles
  • Fixed problem with not using placeholder text when editing missing tiddlers
  • Fixed problem with test data in certain time zones
  • Fixed problem with non-breaking space characters being converted into '@' symbols
  • Fixed problem with highlighting plugin only working in the browser
  • Fixed crash when wiki/themes folder contains files that are not themes

Release 5.0.7-beta

Release date: 26th January 2014 at 21:07

See GitHub for detailed change history of this release

Incompatible Changes

These are changes that might affect users upgrading from previous betas.

Documentation updates

Improvements

Bug Fixes

  • Fixed problem with default format of ViewWidget substituting seconds for minutes in displayed times
  • Fixed problem that was causing several animations to fail in Safari
  • Fixed problem with unclickable sidebar under the Centralised theme
  • Fixed problem with non-system tiddlers showing up in system tiddler advanced search
  • Fixed problem with notifications not always disappearing in Firefox
  • Fixed problem with wiki folders including wiki files with tiddlers that do not have a title
  • Fixed problem with ServerCommand logging "Serving on undefined:8080"

Release 5.0.6-beta

Release date: 3rd January 2014 at 17:14

See GitHub for detailed change history of this release

Improvements

Bug Fixes

  • Fixed import browse button
  • Fixed crash when attempting full screen mode on browsers that don't support it
  • Fixed requirement for a newline immediately after a horizontal rule, table or typed block (thanks to StephanHradek)
  • Fixed problem with placeholder attibute on InternetExplorer (thanks to DavidJade)

Release 5.0.5-beta

Release date: 24th December 2013 at 14:30

See GitHub for detailed change history of this release

Improvements

Bug Fixes

  • Fixed problem with modal wizard positioning on narrow screens
  • Fix problem with static content being included in empty.html when downloaded from the full wiki
  • Improved performance of tiddler import with large tiddlers on Firefox

Release 5.0.4-beta

Release date: 22nd December 2013 at 15:44

See GitHub for detailed change history of this release

Improvements

  • Switched to using an HTML5 placeholder for the default text of a new tiddler
  • Refactored stylesheet handling so that theme tweaks are now applied immediately, and some ordering issues have been resolved
  • Several improvements for running TiddlyWiki on Node.js:
    • The tiddlywiki.info file in the root of wiki folder file is now optional, falling back to a default configuration suitable for serverside use (commit)
    • The file system plugin now automatically creates the tiddlers subfolder in the wiki folder
  • Added favicon.ico support
  • Added SaveTiddlerCommand

Bug Fixes

  • Fixed problem with tiddlers sometimes wrongly opening at the top of the story (commit)
  • Fixed problem with refreshing RadioWidget
  • Fixed problem with the dragger image being visible in some circumstances
  • Fixed drag and drop support on InternetExplorer, contributed by DavidJade (@davidjade on GitHub)
  • Fixed crash on modifying page template (commit)
  • Updated fullscreen plugin to latest version of the API (commit)
  • Improved handling of double square brackets within tags (thanks to StephanHradek)

This release includes minor bug fixes and documentation updates.

Release 5.0.3-beta

Release date: 15th December 2013 at 17:00

See GitHub for detailed change history of this release

This release includes minor bug fixes and documentation updates.

Release 5.0.2-beta

Release date: 15th December 2013 at 14:36

See GitHub for detailed change history of this release

Improvements

Bug fixes

  • Fixed problem deleting tiddlers under the filesystemadaptor
  • Fixed problem with transcluding fields containing lists or dates (eg, {{!!tags}})
  • Fixed problem with re-ordering page control tiddlers (ie tiddlers tagged $:/tags/PageControls)
  • Update template used for deploying to TiddlyWeb
  • Fixed problem with tiddler deletions via the file system adaptor

Internal changes

Release 5.0.1-alpha

Release date: 6th December 2013 at 17:53

See GitHub for detailed change history of this release

Improvements

  • Changes to the importing process to enable a smoother Upgrading process
    • Ignores attempts to import plugins that are older than currently installed plugins
    • System tiddlers are now imported as usual
  • If $:/theme isn't defined or refers to a missing tiddler, then fallback through Snow White to Vanilla. This means that empty.html now defaults to Snow White
  • Added support for Block Quotes in WikiText

Bug fixes

  • Fixed bug that was preventing $:/tags/PageControls tiddlers from being reordered

Internal changes

Release 5.0.0-alpha.17

Release date: 30th November 2013 at 15:19

See GitHub for detailed change history of this release

Bug fixes

  • Fixes a small but important bug that prevented downloading an empty wiki with alpha.16

Release 5.0.0-alpha.16

Release date: 30th November 2013 at 13:25

See GitHub for detailed change history of this release

New Features and Improvements

  • Improved appearance of tags editor
  • Improved generation of qualified tiddler titles for state storage
    • Instead of $:/state/tab/sidebar-{$:/core/ui/SideBar|$:/core/ui/SideBar||}{$:/core/ui/PageTemplate|$:/core/ui/PageTemplate||} one gets $:/state/tab/sidebar-{1743827719}
  • Significant updates to the structure and content of the user documentation
  • Added a new plugin for displaying corner ribbons; currently used for a version banner on tw5.com
  • Split Snow White theme into a base Vanilla theme with all the basic formatting, leaving the decorative bits to Snow White
    • Existing TiddlyWikiFolders will need updating to include Vanilla as an additional theme
  • The page building blocks are now driven by the system tag $:/tags/PageTemplate
  • Fixed problem that prevented tag configured items from shadow tiddlers interleaving with items from ordinary tiddlers
  • Refactored control panel to add Saving tab that includes TiddlySpot options
  • Improved notifications when saving to TiddlySpot
  • Added backup URL to TiddlySpot control panel tab
  • Extended the ServerCommand to add primitive support for basic authentication when running under Node.js

Bug fixes

  • Fixed problem with displaying tiddler titles that contain WikiText syntax
  • No longer crashes when encountering an error in a filter string
  • Fixed a crash when dragging and dropping tiddlers within TiddlyWiki5
  • No longer update the modified date for imported tiddlers
  • Automatically forces new field names to be lower case

Internal changes

  • Added Windows-compatible build scripts
  • Changes to the SavingMechanism to allow the tiddlers that are saved to be selected
  • The main HTML file template used for saving TiddlyWiki5 documents has changed from $:/core/templates/tiddlywiki5.template.html to $:/core/save/all
  • Moved tw5.com's Google Analytics integration into a proper plugin

Contributors to this release include @jermolene, @asampal and @pmario.

Release 5.0.0-alpha.15

Release date: 19th November 2013 at 12:21

See GitHub for detailed change history of this release

New Features

  • Added a dropdown to the edit template for setting the tiddler type
  • A saver module for Microsoft Internet Explorer version 10 and above. Clicking save in the sidebar causes the browser to pull up a bar at the bottom of the window where you can click save. You then get a new copy of your wiki in the downloads folder.
  • Support for new tw-close-other-tiddlers message (eg, )
  • For http://five.tiddlywiki.com, add a tiddler info tab with a link to the static representation of the tiddler
  • Make more UI elements extensible via system tags:

Improvements

  • Rename the <$setvariable> to <$set>
    • <$setvariable> will temporarily remain as a synonym for <$set> for the next few releases
  • Improve the popup mechanism so that the tiddler info panel doesn't close so easily
  • Various improvements for working with TiddlyWeb, including:
    • Updated control panel

Bug fixes

  • Fixed bug when creating a tiddler title starting or ending with a space
  • Fixed behaviour of tags editor dropdown when search box is empty
  • Fixed problem with interpretation of fields and index attributes of the TranscludeWidget
  • Fixed the module type names in the internal tab of the control panel
  • Improved styling for embedded PDFs
  • Fixed bug with second being omitted from serialised date formats

Contributors to this release include @jermolene and @grayeul.

Release 5.0.0-alpha.14

Release date: 10th November 2013 at 23:15

See GitHub for detailed change history of this release

This release has several bug fixes:

  • Improved the layout of the control panel
  • Fixed problem with using the CheckboxWidget to apply tags to tiddlers that don't have any existing tags
  • Fixed problem with default password for the PasswordWidget being the string "null"

Release 5.0.0-alpha.13

Release date: 9th November 2013 at 19:27

See GitHub for detailed change history of this release

This release has several bug fixes:

  • Fixes to DaveGifford's themes blanca, blue and rocker
  • Fix an issue with the <$edit-text> widget
  • Documentation updates
  • Improved deployment scripts
  • Made the modifier field in the subtitle be a link
  • Styling improvements for the CodeMirror plugin
  • Improved the ViewWidget so that it falls back to displaying its content if the field/property is missing or empty
  • Extend use of the built-in <<tabs>> macro to the tiddler info panel, the control panel and the sidebar
    • This means that you can add new tabs by creating tiddlers with these tags, and optionally a caption field for the text of the tab:

Release 5.0.0-alpha.12

Release date: 8th November 2013 at 21:41

See GitHub for detailed change history of this release

This minor release just contains fixes for the syncer and related adaptor modules for the TiddlyWeb edition and for TiddlyWiki5's integrated server.

Release 5.0.0-alpha.11

Release date: 8th November 2013 at 18:06

This release is the culmination of a large scale refactoring of the widget mechanism of TiddlyWiki5. There are several changes to be aware of if upgrading from earlier versions:

  • The following widgets have been removed:
    • <$setstyle> - use <div style=<<macroName Param>>> instead
    • <$video> - will return in a later release
    • <$datauri> - use the <<makedatauri>> built-in macro instead
    • <$error> - may return in a later release
    • <$import> - use the BrowseWidget, DropzoneWidget and NavigatorWidget instead
    • <$info> - use the <<changecount>> built-in macro instead
    • <$version> - use the <<version>> built-in macro instead
  • The following widgets have had significant changes:
    • EditWidget
    • ListWidget - the list widget itself no longer generates HTML nodes, so you'll often need to wrap the template in a <div> or a <span> to be able to style the content
    • ViewWidget - has several changes:
      • <$view format="link"/> is no longer available; use an explicit <$link> widget instead
      • <$view format="link"/> is no longer available; use the TranscludeWidget instead
  • The following new widgets have been added:
  • Widget attribute names have been made more consistent. In particular, tiddler is used to reference a tiddler by title, not title
  • It is no longer possible to import the macro definitions within another tiddler by transcluding that tiddler
  • The body element now has the class tw-body, which will need to be specified in any overrides
    • This was done due to the new support for HTML foreign objects, which makes it possible to have multiple <body> elements in a document

releasenote

3 months ago

Releasing a new version of TiddlyWiki5

4 days ago
  1. Adjust the release date of the latest release tiddler (eg, Release 5.0.7-beta)
  2. Adjust the modified time of HelloThere
  3. Make sure Jermolene/TiddlyWiki5 is fully committed
  4. Edit package.json to the new version number
  5. Run bld.sh to build the deployment files
  6. Restore package.json to the previous version number
  7. Run verbump "5.0.8-beta", substituting the new version number
  8. Run deploy.sh
  9. Run wbld.sh <username> <password>

RenderingMechanism

7 months ago

RenderTiddlerCommand

Render an individual tiddler as a specified ContentType, defaults to text/html and save it to the specified filename:

--rendertiddler <title> <filename> [<type>]

By default, the filename is resolved relative to the output subdirectory of the edition directory. The --output command can be used to direct output to a different directory.

Any missing directories in the path to the filename are automatically created.

RenderTiddlersCommand

Render a set of tiddlers matching a filter to separate files of a specified ContentType (defaults to text/html) and extension (defaults to .html).

--rendertiddlers <filter> <template> <pathname> [<type>] [<extension>]

For example:

--rendertiddlers [!is[system]] $:/core/templates/static.tiddler.html ./static text/plain

By default, the pathname is resolved relative to the output subdirectory of the edition directory. The --output command can be used to direct output to a different directory.

Any files in the target directory are deleted. The target directory is recursively created if it is missing.

ReportingBugs

19 days ago

There are two ways to report bugs in TiddlyWiki:

Unless you are already familiar with GitHub, it's usually easiest to report problems through the discussion groups.

TiddlyWiki on GitHub

We use GitHub Issues to manage bug reports and feature requests for TiddlyWiki. To maintain their effectiveness we endeavour to have as few open issues as possible.

Policies for Managing Issues

Open issues should be actionable: generally either a reproducible bug report, or a specific feature request. From the perspective of the core developers, the issues list behaves like a shared todo list. Every item on the list requires a little bit of attention each time we check the list.

GitHub Issues are not very good for managing ideas that are not immediately actionable. Better to use the TiddlyWiki discussion groups for open ended questions, or speculative discussions of new features.

Creating Issues

Before creating a GitHub issue it is good etiquette to search through the existing issues to see whether the problem has already been reported. If a search isn't practical, don't worry too much; GitHub makes it easy to merge existing issues.

When you do create an issue, remember that for effective debugging, we need as much information as possible. At a minimum, please try to include:

  • A descriptive title
  • A summary
  • Steps to reproduce
  • Expected behaviour
  • Context (OS, browser etc.)

Consider also adding screenshots if it makes things clearer.

There's a lot of good material on the web about bug reports:

Resources

3 months ago

These resources created by the TiddlyWiki Community help you get the best out of TiddlyWiki. Submit new entries via GitHub, Twitter or by posting in the TiddlyWiki Groups.

RevealWidget

4 months ago

Introduction

The reveal widget hides or shows its content depending upon the value of a state tiddler. The type of the widget determines the condition for the content being displayed:

  • type=match: the content is displayed if the state tiddler matches a specified value
  • type=nomatch: the content is displayed if the state tiddler doesn't match a specified value
  • type=popup: the content is displayed as a popup as described in the PopupMechanism

Content and Attributes

The content of the <$reveal> widget is displayed according to the rules given above.

AttributeDescription
stateThe title of the tiddler containing the state
typeThe type of matching performed: match, nomatch or popup
textThe text to match when the type is match and nomatch
positionThe position used for the popup when the type is popup. Can be left, above, aboveright, right, belowleft or below
defaultDefault value to use when the state tiddler
animateSet to "yes" to animate opening and closure (defaults to "no")
retainSet to "yes" to force the content to be retained even when hidden (defaults to "no")

Retaining the content when hidden can give poor performance since the hidden content requires refresh processing even though it is not displayed. On the other hand, the content can be revealed much more quickly. Note that setting animate="yes" will also force retain="yes".

Examples

Simple content reveal

Here's a simple example of showing and hiding content with buttons:

"Slider"

A slider appears as a single button that can be used to toggle the display of the contained content.

Popup

Here is a simple example of a popup built with the RevealWidget:

RoadMap

2 days ago

TiddlyWiki is under rapid development at the moment as it moves through beta to a full release.

Beta

During the beta TiddlyWiki will be practical for cautious everyday use but as we perfect the product there will occasionally be situations where we have to make changes that are not backwards compatible. These occasions will be clearly marked in the release notes.

The following additional features are planned or under consideration for implementation during the beta:

  • Features to improve user data integrity
  • Features required for large scale adoption
    • Improve upgrade process
    • Establish plugin library
    • Proper use of ARIA roles (in progress)
  • Fixing hangovers from TiddlyWikiClassic
    • TiddlyWiki file format (to avoid illegal attribute names)
    • Tiddler object format (to provide true polymorphism of field values)
  • Perfecting WikiText
    • Global macros
    • [img[url]] for remote image embedding, and [ext[url]] for explicit external links
    • Further WikiText features
  • Productivity features
    • Import wizard allowing individual tiddlers to be selected for import
    • Aliases
    • Search and replace
    • Tiddler renaming
    • Rich link tooltips, incorporating a preview
    • Keyboard shortcuts
    • Keyboard snippet expansion in the text editor
    • List editor with drag and drop
    • Selective/weighted searching by title, body and fields
    • Maths notation

Also see the issues list on GitHub: https://github.com/Jermolene/TiddlyWiki5

General Release

TiddlyWiki will leave beta and become a full release in the summer of 2014. That is the point at which it is declared stable enough for general use. It will continue to improve and evolve after this point, although constrained to remain backwards compatible so that plugins and content created for version 5.0 will continue to work into the indefinite future.

SafeMode

2 months ago

Introduction

Safe mode provides a way to disabling most customisations in TiddlyWiki. This is useful because if TiddlyWiki is customised incorrectly it can be rendered inoperable. A particular issue is that some customisations break when upgrading to a newer core version of TiddlyWiki (especially during the beta).

Enabling Safe Mode

Safe mode is enabled in the browser by starting TiddlyWiki with the URL hash set to the string #:safe. For example:

http://tiddlywiki.com/#:safe

How Safe Mode Works

In safe mode, any tiddlers that override shadow tiddlers are renamed to give them the prefix SAFE: , thus restoring the underlying shadow tiddler.

A report tiddler is displayed that allows you to inspect the tiddlers that were renamed.

SampleAlert

This is a demonstration alert.

Note that the trashcan icon deletes the tiddler containing this alert. You can also remove it by opening the tiddler SampleAlert and editing it to remove the tag $:/tags/Alert.

SampleNotification

13 months ago

This is a notification!

sampletag1

This is sampletag1.

sampletag2

This is sampletag2.

SampleTiddlerFirst

This is test tiddler SampleTiddlerFirst.

SampleTiddlerSecond

This is test tiddler SampleTiddlerSecond.

SampleTiddlerThird

This is test tiddler SampleTiddlerThird.

SampleWizard

This is a modal wizard dialogue, stored in the tiddler SampleWizard.

You can .

SampleWizard2

This is another modal wizard dialogue, stored in the tiddler SampleWizard2.

You can .

SaveTiddlerCommand

6 months ago

Saves an individual tiddler in its raw text or binary format to the specified filename.

--savetiddler <title> <filename>

By default, the filename is resolved relative to the output subdirectory of the edition directory. The --output command can be used to direct output to a different directory.

Any missing directories in the path to the filename are automatically created.

SaveTiddlersCommand

14 days ago

Saves a group of tiddlers in their raw text or binary format to the specified directory.

--savetiddlers <filter> <pathname>

By default, the pathname is resolved relative to the output subdirectory of the edition directory. The --output command can be used to direct output to a different directory.

Any missing directories in the pathname are automatically created.

Saving on a PHP Server

5 months ago

The built-in TiddlySpot saver can also be used to save changes to a simple PHP script that you can run on most hosting providers.

These are preliminary instructions that need verification

  1. Download a copy of store.php from:
  2. Edit your copy of store.php to add your username(s) and password(s). Find the line $USERS = array( 'UserName1'=>'Password1', etc) and replace Username1 and Password1 with your desired username and password
    • Make sure you leave all the punctuation and code, such as the single quotes, intact
  3. Save the file
  4. Using FTP or your web interface, upload store.php to your server. Make sure that the filename is correct
  5. In TiddlyWiki, go to the Saving tab of the control panel and enter the following information:
    • Your username as the wiki name
    • Your password
    • The URL of the store.php file (not the URL of the wiki, this must the full URL to the store.php file)

The control panel Saving tab includes the following configuration options:

NameDescription
Server URLThe full URL to the store.php file on your server
Upload filenameThe filename used to save the TiddlyWiki (defaults to index.html)
Upload directoryThe relative path from store.php to the directory used for saving the file
Backup directoryThe relative path from store.php to the directory used for backups

Saving on Android

6 months ago

The AndTidWiki app for Android devices makes it possible to edit and save changes to TiddlyWiki5, including working offline without a network connection.

Note that AndTidWiki is published independently of TiddlyWiki

Saving on InternetExplorer

6 months ago

By default, TiddlyWiki saves changes on InternetExplorer 10 and above using a saver module that downloads the newly modified file, rather than saving it directly. There are two alternatives that both save changes directly to the file:

Saving on iPad/iPhone

6 months ago

The iPad/iPhone app TWEdit makes it possible to edit and save changes to TiddlyWiki5, including working offline without a network connection. Download it here.

Instructions for use:

  1. Open TWEdit
  2. Touch the title in the centre of the toolbar in order
    • A text box should appear allowing you to enter a URL
  3. Enter the URL http://tiddlywiki.com/empty.html
  4. When the empty TiddlyWiki5 has loaded, touch the save icon (it's the second icon from the right on the top toolbar)
    • An alert box should appear allowing you to enter a local filename
  5. Enter the filename you wish to use for the document (ending with .html)
  6. Edit your TiddlyWiki as normal
  7. To save changes, click the save button in the sidebar
    • A confirmation message should appear at the upper right

Note that TWEdit is published independently of TiddlyWiki

Saving on TiddlySpot

6 months ago

TiddlySpot is a free hosting service for TiddlyWiki documents from Simon and Daniel Baird. It has been in operation almost as long as TiddlyWiki itself.

TiddlyWiki5 isn't yet built in to TiddlySpot but you can use it by following these steps:

  1. Sign up for a new wiki at http://tiddlyspot.com/, and remember the wiki name and password
  2. Open TiddlyWiki5 in your browser from http://tiddlywiki.com/empty.html
  3. Fill in the TiddlySpot wikiname and password in the control panel
  4. Click the "Save Changes" button. You should get a confirmation notification at the top right saying Saved wiki. Saving can take several seconds if you're on a slow connection or working with a large wiki.
    • This step won't work in Firefox thanks to its default security policy. Google Chrome works fine
  5. Navigate to your TiddlySpot URL at http://{wikiname}.tiddlyspot.com/
  6. You should see a copy of TiddlyWiki5. You can edit and create tiddlers, and click "Save Changes" to save changes back up to TiddlySpot (you'll need to re-enter your password the first time you visit the wiki on TiddlySpot)

Saving with Encryption

6 months ago

When used as a single HTML file, TiddlyWiki5 allows content to be encrypted using the Stanford JavaScript Crypto Library.

  1. Switch to the Tools tab in the sidebar and look for the words This wiki is not encrypted and a button labelled Set password
  2. Click Set password
  3. Type a password and click the Set button (or use the enter key)
  4. The control panel should now say This wiki is encrypted with buttons for changing and clearing the password
  5. Save the wiki using the button in the sidebar
  6. Optionally, open the saved file in a text editor and verify that your data is encrypted
  7. Open the file in your browser. You will be prompted for a password before the content is displayed

Saving with the HTML5 fallback saver

3 months ago

This method of saving changes is clunky but has the advantage of working on almost all desktop browsers, and many mobile browsers.

  1. Download an empty TiddlyWiki by clicking this button:

    If the button doesn't work save this link: http://tiddlywiki.com/empty.html

    Your browser may ask you to accept the download before it begins

  2. Locate the file you just downloaded
    • You may rename it, but be sure to keep the .html or .htm extension
  3. Open the file in your browser
  4. Try creating a new tiddler using the plus button in the sidebar. Type some content for the tiddler, and click the tick button
  5. Save your changes by clicking the download button in the sidebar
  6. Your browser will download a new copy of the wiki incorporating your changes
  7. Locate the newly downloaded file and open it in your browser
  8. Verify that your changes have been saved correctly

Tip: most browsers have an option to prompt each time for the download location. This allows you to select the existing version of the file and replace it.

Saving with TiddlyFox

3 months ago

If you're using Firefox for Android, see the instructions for Saving with TiddlyFox on Android.

  1. Ensure you have the latest version of Firefox
  2. Install the latest release of the TiddlyFox extension from:
  3. Restart Firefox
  4. Download an empty TiddlyWiki by clicking this button:

  5. Locate the file you just downloaded
    • You may rename it, but be sure to keep the .html or .htm extension
  6. Open the file in Firefox
  7. Click OK in response to the prompt from TiddlyFox that asks whether to enable saving for this file
  8. Try creating a new tiddler using the plus button in the sidebar. Type some content for the tiddler, and click the tick button
  9. Save your changes by clicking the download button in the sidebar
    • Look for the yellow notification Saved wiki at the top right of the window
  10. Refresh the browser window to verify that your changes have been saved correctly

Saving with TiddlyFox on Android

5 months ago

(Alternatively, see the video tutorial)

  1. Ensure you have the latest version of Firefox for Android
  2. Install the latest release of the TiddlyFox extension from:
  3. Install this extension to be able to save the TiddlyWiki file locally:
  4. Download an empty TiddlyWiki by saving this link:

    (to save the link, ensure you've installed the "save-link-menus" extension and then long-press on the link and choose "Save link")

  5. When the file has downloaded, click on it within the notification tray or the download manager application
  6. Choose to open the file in Firefox (rather than the default Android viewer)
  7. Click OK in response to the prompt from TiddlyFox that asks whether to enable saving for this file
  8. Try creating a new tiddler using the plus button in the sidebar. Type some content for the tiddler, and click the tick button
  9. Save your changes by clicking the download button in the sidebar
    • Look for the yellow notification Saved wiki at the top right of the window
  10. Refresh the browser window to verify that your changes have been saved correctly

Saving with TiddlyIE

6 months ago
  1. Install the TiddlyIE add-on from:
  2. Restart Internet Explorer. IE will prompt you to enable the TiddlyIE add-on.

    You may also see a prompt to enable the Microsoft Script Runtime

  3. Download an empty TiddlyWiki by clicking this button:

    Your browser may ask you to accept the download before it begins

  4. Locate the file you just downloaded
    • You may rename it, but be sure to keep the .html extension
  5. Open the file in Internet Explorer
  6. Try creating a new tiddler using the plus button in the sidebar. Type some content for the tiddler, and click the tick button
  7. Save your changes by clicking the download button in the sidebar. Internet Explorer will ask for your consent to save the file locally by presenting a file Save As dialog.
  8. Refresh the browser window to verify that your changes have been saved correctly

Scalability

10 months ago

You might expect that TiddlyWiki's architecture as a SinglePageApplication would make it unsuitable for large amounts of data. In fact, TiddlyWiki users regularly work with files that are 20 or 30 megabytes without problems - and successful experiments have been done up into the gigabytes.

Scripts for TiddlyWiki on Node.js

4 months ago

Script Files

The TiddlyWiki5 repo contains several scripts that are used to build and deploy TiddlyWiki5 (.sh for *nix and .cmd for Windows). They can serve as a useful starting point for your own scripts.

bld: builds tw5.com

This script builds several variants of TiddlyWiki5 for deployment on tiddlywiki.com.

By default, files are output to a folder called jermolene.github.com, sibling to the TiddlyWiki5 repo directory. For example:

/TiddlyWork/ - Directory for working with TiddlyWiki5
  |
  +--+-- /TiddlyWiki5/ - Directory containing the TiddlyWiki5 repo from GitHub
     |
     +-- /jermolene.github.com/ - Directory for output files

You can override the build output directory by defining the environment variable TW5_BUILD_OUTPUT. The easiest way to do this is to create a personal batch file to invoke TiddlyWiki5 that first sets the environment variable and then invokes bld.

The files output by bld are:

  • readme.md main readme file, output to the TiddlyWiki5 directory
  • index.html TiddlyWiki5 standalone HTML file with content from the tw5.com edition
  • empty.html TiddlyWiki5 standalone HTML file with no content
  • encrypted.html TiddlyWiki5 standalone HTML file encrypted with the password password
  • test.html TiddlyWiki5 browser-based test suite (see TestingMechanism)
  • static.html static HTML version of the DefaultTiddlers of the tw5.com edition
  • static/*.html and static/static.css static HTML versions of individual tiddlers

bld also runs the TiddlyWiki5 Node.js-based test suite (see TestingMechanism)

serve: serves tw5.com

serve.sh <username> [<password>]

Or:

serve.cmd <username> [<password>]

This script starts TiddlyWiki5 running as an HTTP server with the content from the clientserver edition. By default, the Node.js serves on port 8080. If the optional username parameter is provided, it is used for signing edits. If the password is provided then HTTP basic authentication is used.

To experiment with this configuration, run the script and then visit http://127.0.0.1:8080 in a browser.

Changes made in the browser propagate to the server over HTTP (use the browser developer console to see these requests). The server then syncs changes to the file system (and logs each change to the screen).

lazy: serves tw5.com with lazily loaded images

lazy.sh <username> [<password>]

Or:

lazy.cmd <username> [<password>]

This script serves the clientserver edition content with LazyLoading applied to images.

wbld: builds TiddlyWiki for TiddlyWeb

This script builds and deploys the code for TiddlyWiki in the Sky for TiddlyWeb. If you want to experiment with your own builds of TiddlyWiki5 for TiddlyWeb you could use this batch file as a base.

2bld: builds TiddlyWiki 2.6.5

This script builds TiddlyWiki 2.6.5 from the original source and then displays the differences between them (diff is used for *nix, fc for Windows).

ScrollableWidget

3 months ago

Introduction

The scrollable widget wraps its content in a scrollable frame. The user can scroll the contents with the mouse or with touch gestures. Code can use the WidgetMessage: tw-scroll to programmatically scroll specific DOM nodes into view.

Content and Attributes

The content of the <$scrollable> widget is displayed within a pair of wrapper DIVs. If the inner DIV is larger then it scrolls within the outer one. CSS is used to specify the size of the outer wrapper.

AttributeDescription
classThe CSS class(es) to be applied to the outer DIV
fallthroughSee below

If a scrollable widget can't handle the tw-scroll message because the inner DIV fits within the outer DIV, then by default the message falls through to the parent widget. Setting the fallthrough attribute to no prevents this behaviour.

Examples

This example requires the following CSS definitions from $:/_tw5.com-styles:

.tw-scrollable-demo {
	border: 1px solid <<colour message-border>>;
	background-color: <<colour message-background>>;
	padding: 1em;
	height: 400px;
}

This wiki text shows how to display a list within the scrollable widget:

Searching

4 months ago

TiddlyWiki supports simple text searches through the search box in the sidebar. More sophisticated search options are featured in the advanced search.

All of them boil down to the use of TiddlerFilters to display the tiddlers that satisfy some criteria.

SelectWidget

7 months ago

Introduction

The select widget displays an HTML select element containing a list of items defined by <option> and <optgroup> elements and binds the selected value to the text of a tiddler field or index.

For example, this select widget displays a list of the tags in this wiki:

The state tiddler currently contains . See the text change as you switch entries in the select widget. Try changing the value of the state tiddler and see the select widget change. Notice how the select widget only displays an entry if there is a precise match with the tiddler text.

Content and Attributes

The content of the <$select> widget should be one or more HTML <option> or <optiongroup> elements that provide the available values.

AttributeDescription
tiddlerThe title of the tiddler containing the value (defaults to the current tiddler)
fieldThe field name for the value in the current tiddler (defaults to "text")
indexThe index of a property in a DataTiddler (takes precedence over the field attribute)
classCSS classes to be assigned to the HTML select element
defaultDefault value to be used if the tiddler, field or index specifies a missing value

Examples

Simple Lists

This example sets the title of the current wiki $:/SiteTitle to one of a list of book titles:

Value lists

In this example the value attribute has been used to specify the text that should be used as the value of the entry instead of the display text.

Option Groups

Entries in the list can be grouped together with the <optgroup> element

Generated Lists

The ListWidget can be used to generate the options for a select widget. For example, here we combine a select widget listing all the tiddlers tagged introduction with a transclusion to display the text of the selected one.

Nested Lists

This example uses a nested pair of list widgets. The outer one generates the <optgroup> elements, and the inner one generates <option> elements:

Server Architecture.svg

9 days ago

ServerCommand

5 months ago

The server built in to TiddlyWiki5 is very simple. Although compatible with TiddlyWeb it doesn't support many of the features needed for robust Internet-facing usage.

At the root, it serves a rendering of a specified tiddler. Away from the root, it serves individual tiddlers encoded in JSON, and supports the basic HTTP operations for GET, PUT and DELETE.

--server <port> <roottiddler> <rendertype> <servetype> <username> <password> <host> <pathprefix>

The parameters are:

  • port - port number to serve from (defaults to "8080")
  • roottiddler - the tiddler to serve at the root (defaults to "$:/core/save/all")
  • rendertype - the content type to which the root tiddler should be rendered (defaults to "text/plain")
  • servetype - the content type with which the root tiddler should be served (defaults to "text/html")
  • username - the default username for signing edits
  • password - optional password for basic authentication
  • host - optional hostname to serve from (defaults to "127.0.0.1" aka "localhost")
  • pathprefix - optional prefix for paths

If the password parameter is specified then the browser will prompt the user for the username and password. Note that the password is transmitted in plain text so this implementation isn't suitable for general use.

For example:

--server 8080 $:/core/save/all text/plain text/html MyUserName passw0rd

To run multiple TiddlyWiki servers at the same time you'll need to put each one on a different port.

SetFieldCommand

14 days ago

Note that this command is experimental and may change or be replaced during the TiddlyWiki version 5 beta

Sets the specified field of a group of tiddlers to the result of wikifying a template tiddler with the currentTiddler variable set to the tiddler.

--setfield <filter> <fieldname> <templatetitle> <rendertype>

The parameters are:

  • filter - filter identifying the tiddlers to be affected
  • fieldname - the field to modify (defaults to "text")
  • templatetitle - the tiddler to wikify into the specified field. If blank or missing then the specified field is deleted
  • type - the text type to render (defaults to "text/plain"; "text/html" can be used to include HTML tags)

Setting a favicon

5 months ago

"favicons" are small icons that most browsers display to help users identify websites.

favicons in the Browser

When TiddlyWiki starts up in the browser it looks for a tiddler called $:/favicon.ico and dynamically uses it as the favicon for the page. If you modify the image then the favicon changes instantly to reflect it.

favicons on the Server

On the server, the ServerCommand will serve the tiddler $:/favicon.ico at the path /favicon.ico.

SetVariableWidget

7 months ago

The <$setvariable> widget has been renamed <$set/>; see SetWidget for more details.

For the moment, you can continue to use <$setvariable> as a synonym for <$set/>, but it will be removed for the beta.

SetWidget

7 months ago

Introduction

The set variable widget assigns a value to a specified variable. The new value of the variable is availale to the content within the set variable widget.

Content and Attributes

The content of the <$set> widget is the scope for the value assigned to the variable.

AttributeDescription
nameThe name of the variable to assign
valueThe value to assign to the variable

ShadowTiddlers

10 months ago

ShadowTiddlers are tiddlers that are loaded from within Plugins. Unlike ordinary tiddlers, they don't appear in most lists.

ShadowTiddlers can be overridden with an ordinary tiddler of the same name. If that tiddler is subsequently deleted then the original shadow tiddler is automatically restored.

The current shadow tiddlers are:

$:/AdvancedSearch
$:/config/AnimationDuration
$:/config/AutoSave
$:/config/BitmapEditor/Colour
$:/config/BitmapEditor/LineWidth
$:/config/EditorTypeMappings/image/gif
$:/config/EditorTypeMappings/image/jpeg
$:/config/EditorTypeMappings/image/jpg
$:/config/EditorTypeMappings/image/png
$:/config/EditorTypeMappings/image/x-icon
$:/config/EditorTypeMappings/text/vnd.tiddlywiki
$:/config/Navigation/UpdateAddressBar
$:/config/Navigation/UpdateHistory
$:/config/SyncFilter
$:/ControlPanel
$:/core/copyright.txt
$:/core/Filters/AllTags
$:/core/Filters/AllTiddlers
$:/core/Filters/Drafts
$:/core/Filters/Missing
$:/core/Filters/Orphans
$:/core/Filters/OverriddenShadowTiddlers
$:/core/Filters/RecentTiddlers
$:/core/Filters/ShadowTiddlers
$:/core/Filters/SystemTags
$:/core/Filters/SystemTiddlers
$:/core/images/cancel-button
$:/core/images/chevron-left
$:/core/images/chevron-right
$:/core/images/close-button
$:/core/images/delete-button
$:/core/images/done-button
$:/core/images/down-arrow
$:/core/images/edit-button
$:/core/images/home-button
$:/core/images/info-button
$:/core/images/menu-button
$:/core/images/new-button
$:/core/images/options-button
$:/core/images/right-arrow
$:/core/images/save-button
$:/core/macros/CSS
$:/core/macros/lingo
$:/core/macros/tabs
$:/core/modules/commander.js
$:/core/modules/commands/build.js
$:/core/modules/commands/clearpassword.js
$:/core/modules/commands/help.js
$:/core/modules/commands/init.js
$:/core/modules/commands/load.js
$:/core/modules/commands/output.js
$:/core/modules/commands/password.js
$:/core/modules/commands/rendertiddler.js
$:/core/modules/commands/rendertiddlers.js
$:/core/modules/commands/savetiddler.js
$:/core/modules/commands/savetiddlers.js
$:/core/modules/commands/server.js
$:/core/modules/commands/setfield.js
$:/core/modules/commands/verbose.js
$:/core/modules/commands/version.js
$:/core/modules/config.js
$:/core/modules/deserializers.js
$:/core/modules/filters.js
$:/core/modules/filters/after.js
$:/core/modules/filters/all.js
$:/core/modules/filters/all/current.js
$:/core/modules/filters/all/missing.js
$:/core/modules/filters/all/orphans.js
$:/core/modules/filters/all/shadows.js
$:/core/modules/filters/all/tiddlers.js
$:/core/modules/filters/backlinks.js
$:/core/modules/filters/before.js
$:/core/modules/filters/commands.js
$:/core/modules/filters/each.js
$:/core/modules/filters/eachday.js
$:/core/modules/filters/field.js
$:/core/modules/filters/fields.js
$:/core/modules/filters/get.js
$:/core/modules/filters/has.js
$:/core/modules/filters/indexes.js
$:/core/modules/filters/is.js
$:/core/modules/filters/is/current.js
$:/core/modules/filters/is/image.js
$:/core/modules/filters/is/missing.js
$:/core/modules/filters/is/orphan.js
$:/core/modules/filters/is/shadow.js
$:/core/modules/filters/is/system.js
$:/core/modules/filters/is/tag.js
$:/core/modules/filters/is/tiddler.js
$:/core/modules/filters/limit.js
$:/core/modules/filters/links.js
$:/core/modules/filters/list.js
$:/core/modules/filters/listed.js
$:/core/modules/filters/listops.js
$:/core/modules/filters/modules.js
$:/core/modules/filters/moduletypes.js
$:/core/modules/filters/next.js
$:/core/modules/filters/plugintiddlers.js
$:/core/modules/filters/prefix.js
$:/core/modules/filters/previous.js
$:/core/modules/filters/removeprefix.js
$:/core/modules/filters/sameday.js
$:/core/modules/filters/search.js
$:/core/modules/filters/shadowsource.js
$:/core/modules/filters/sort.js
$:/core/modules/filters/storyviews.js
$:/core/modules/filters/tag.js
$:/core/modules/filters/tagging.js
$:/core/modules/filters/tags.js
$:/core/modules/filters/title.js
$:/core/modules/filters/untagged.js
$:/core/modules/language.js
$:/core/modules/macros/changecount.js
$:/core/modules/macros/makedatauri.js
$:/core/modules/macros/qualify.js
$:/core/modules/macros/version.js
$:/core/modules/parsers/csvparser.js
$:/core/modules/parsers/htmlparser.js
$:/core/modules/parsers/imageparser.js
$:/core/modules/parsers/textparser.js
$:/core/modules/parsers/wikiparser/rules/codeblock.js
$:/core/modules/parsers/wikiparser/rules/codeinline.js
$:/core/modules/parsers/wikiparser/rules/commentblock.js
$:/core/modules/parsers/wikiparser/rules/commentinline.js
$:/core/modules/parsers/wikiparser/rules/dash.js
$:/core/modules/parsers/wikiparser/rules/emphasis.js
$:/core/modules/parsers/wikiparser/rules/entity.js
$:/core/modules/parsers/wikiparser/rules/extlink.js
$:/core/modules/parsers/wikiparser/rules/filteredtranscludeblock.js
$:/core/modules/parsers/wikiparser/rules/filteredtranscludeinline.js
$:/core/modules/parsers/wikiparser/rules/hardlinebreaks.js
$:/core/modules/parsers/wikiparser/rules/heading.js
$:/core/modules/parsers/wikiparser/rules/horizrule.js
$:/core/modules/parsers/wikiparser/rules/html.js
$:/core/modules/parsers/wikiparser/rules/image.js
$:/core/modules/parsers/wikiparser/rules/list.js
$:/core/modules/parsers/wikiparser/rules/macrocallblock.js
$:/core/modules/parsers/wikiparser/rules/macrocallinline.js
$:/core/modules/parsers/wikiparser/rules/macrodef.js
$:/core/modules/parsers/wikiparser/rules/prettyextlink.js
$:/core/modules/parsers/wikiparser/rules/prettylink.js
$:/core/modules/parsers/wikiparser/rules/quoteblock.js
$:/core/modules/parsers/wikiparser/rules/rules.js
$:/core/modules/parsers/wikiparser/rules/styleblock.js
$:/core/modules/parsers/wikiparser/rules/styleinline.js
$:/core/modules/parsers/wikiparser/rules/table.js
$:/core/modules/parsers/wikiparser/rules/transcludeblock.js
$:/core/modules/parsers/wikiparser/rules/transcludeinline.js
$:/core/modules/parsers/wikiparser/rules/typedblock.js
$:/core/modules/parsers/wikiparser/rules/wikilink.js
$:/core/modules/parsers/wikiparser/rules/wikirulebase.js
$:/core/modules/parsers/wikiparser/wikiparser.js
$:/core/modules/pluginswitcher.js
$:/core/modules/savers/andtidwiki.js
$:/core/modules/savers/download.js
$:/core/modules/savers/fsosaver.js
$:/core/modules/savers/manualdownload.js
$:/core/modules/savers/msdownload.js
$:/core/modules/savers/nodewebkit.js
$:/core/modules/savers/tiddlyfox.js
$:/core/modules/savers/tiddlyie.js
$:/core/modules/savers/twedit.js
$:/core/modules/savers/upload.js
$:/core/modules/startup.js
$:/core/modules/startup/commands.js
$:/core/modules/startup/favicon.js
$:/core/modules/startup/load-modules.js
$:/core/modules/startup/password.js
$:/core/modules/startup/render.js
$:/core/modules/startup/rootwidget.js
$:/core/modules/startup/story.js
$:/core/modules/startup/syncer-browser.js
$:/core/modules/storyviews/classic.js
$:/core/modules/storyviews/pop.js
$:/core/modules/storyviews/zoomin.js
$:/core/modules/syncer.js
$:/core/modules/tiddler.js
$:/core/modules/utils/crypto.js
$:/core/modules/utils/dom.js
$:/core/modules/utils/dom/animations/slide.js
$:/core/modules/utils/dom/animator.js
$:/core/modules/utils/dom/browser.js
$:/core/modules/utils/dom/http.js
$:/core/modules/utils/dom/keyboard.js
$:/core/modules/utils/dom/modal.js
$:/core/modules/utils/dom/notifier.js
$:/core/modules/utils/dom/popup.js
$:/core/modules/utils/dom/scroller.js
$:/core/modules/utils/fakedom.js
$:/core/modules/utils/filesystem.js
$:/core/modules/utils/logger.js
$:/core/modules/utils/parsetree.js
$:/core/modules/utils/parseutils.js
$:/core/modules/utils/performance.js
$:/core/modules/utils/pluginmaker.js
$:/core/modules/utils/utils.js
$:/core/modules/widgets/browse.js
$:/core/modules/widgets/button.js
$:/core/modules/widgets/checkbox.js
$:/core/modules/widgets/codeblock.js
$:/core/modules/widgets/count.js
$:/core/modules/widgets/dropzone.js
$:/core/modules/widgets/edit-binary.js
$:/core/modules/widgets/edit-bitmap.js
$:/core/modules/widgets/edit-text.js
$:/core/modules/widgets/edit.js
$:/core/modules/widgets/element.js
$:/core/modules/widgets/encrypt.js
$:/core/modules/widgets/entity.js
$:/core/modules/widgets/fieldmangler.js
$:/core/modules/widgets/fields.js
$:/core/modules/widgets/image.js
$:/core/modules/widgets/importvariables.js
$:/core/modules/widgets/keyboard.js
$:/core/modules/widgets/link.js
$:/core/modules/widgets/linkcatcher.js
$:/core/modules/widgets/list.js
$:/core/modules/widgets/macrocall.js
$:/core/modules/widgets/navigator.js
$:/core/modules/widgets/password.js
$:/core/modules/widgets/radio.js
$:/core/modules/widgets/raw.js
$:/core/modules/widgets/reveal.js
$:/core/modules/widgets/scrollable.js
$:/core/modules/widgets/select.js
$:/core/modules/widgets/set.js
$:/core/modules/widgets/text.js
$:/core/modules/widgets/tiddler.js
$:/core/modules/widgets/transclude.js
$:/core/modules/widgets/view.js
$:/core/modules/widgets/widget.js
$:/core/modules/wiki.js
$:/core/save/all
$:/core/save/empty
$:/core/save/lazy-images
$:/core/templates/alltiddlers.content
$:/core/templates/alltiddlers.template.html
$:/core/templates/canonical-uri-external-image
$:/core/templates/css-tiddler
$:/core/templates/html-div-tiddler
$:/core/templates/html-tiddler
$:/core/templates/javascript-tiddler
$:/core/templates/module-tiddler
$:/core/templates/MOTW.html
$:/core/templates/plain-text-tiddler
$:/core/templates/split-recipe
$:/core/templates/static-tiddler
$:/core/templates/static.area
$:/core/templates/static.content
$:/core/templates/static.template.css
$:/core/templates/static.template.html
$:/core/templates/static.tiddler.html
$:/core/templates/store.area.template.html
$:/core/templates/tid-tiddler
$:/core/templates/tiddler-metadata
$:/core/templates/tiddlywiki5.html
$:/core/templates/version
$:/core/templates/wikified-tiddler
$:/core/ui/AdvancedSearch/Filter
$:/core/ui/AdvancedSearch/Shadows
$:/core/ui/AdvancedSearch/Standard
$:/core/ui/AdvancedSearch/System
$:/core/ui/AlertTemplate
$:/core/ui/BinaryWarning
$:/core/ui/ControlPanel/Advanced
$:/core/ui/ControlPanel/Advanced/EditorTypes
$:/core/ui/ControlPanel/Advanced/LoadedModules
$:/core/ui/ControlPanel/Advanced/Settings
$:/core/ui/ControlPanel/Advanced/Settings/NavigationAddressBar
$:/core/ui/ControlPanel/Advanced/Settings/NavigationHistory
$:/core/ui/ControlPanel/Advanced/TiddlerFields
$:/core/ui/ControlPanel/Appearance
$:/core/ui/ControlPanel/Appearance/Palette
$:/core/ui/ControlPanel/Appearance/StoryView
$:/core/ui/ControlPanel/Appearance/Theme
$:/core/ui/ControlPanel/Basics
$:/core/ui/ControlPanel/Plugins
$:/core/ui/ControlPanel/Saving
$:/core/ui/ControlPanel/Tools
$:/core/ui/EditTemplate
$:/core/ui/EditTemplate/body
$:/core/ui/EditTemplate/controls
$:/core/ui/EditTemplate/fields
$:/core/ui/EditTemplate/shadow
$:/core/ui/EditTemplate/tags
$:/core/ui/EditTemplate/title
$:/core/ui/EditTemplate/type
$:/core/ui/EditToolbar/cancel
$:/core/ui/EditToolbar/delete
$:/core/ui/EditToolbar/save
$:/core/ui/ListItemTemplate
$:/core/ui/MissingTemplate
$:/core/ui/MoreSideBar/All
$:/core/ui/MoreSideBar/Drafts
$:/core/ui/MoreSideBar/Missing
$:/core/ui/MoreSideBar/Orphans
$:/core/ui/MoreSideBar/Recent
$:/core/ui/MoreSideBar/Shadows
$:/core/ui/MoreSideBar/System
$:/core/ui/MoreSideBar/Tags
$:/core/ui/MoreSideBar/Types
$:/core/ui/PageControls/control-panel
$:/core/ui/PageControls/new-tiddler
$:/core/ui/PageControls/save-wiki
$:/core/ui/PageStylesheet
$:/core/ui/PageTemplate
$:/core/ui/PageTemplate/alerts
$:/core/ui/PageTemplate/sidebar
$:/core/ui/PageTemplate/story
$:/core/ui/PageTemplate/topleftbar
$:/core/ui/PageTemplate/toprightbar
$:/core/ui/SideBar/More
$:/core/ui/SideBar/Open
$:/core/ui/SideBar/Recent
$:/core/ui/SideBar/Tools
$:/core/ui/SideBarLists
$:/core/ui/TagTemplate
$:/core/ui/TiddlerFields
$:/core/ui/TiddlerFieldTemplate
$:/core/ui/TiddlerInfo
$:/core/ui/TiddlerInfo/Advanced
$:/core/ui/TiddlerInfo/Advanced/PluginInfo
$:/core/ui/TiddlerInfo/Advanced/ShadowInfo
$:/core/ui/TiddlerInfo/Fields
$:/core/ui/TiddlerInfo/List
$:/core/ui/TiddlerInfo/Listed
$:/core/ui/TiddlerInfo/References
$:/core/ui/TiddlerInfo/Tagging
$:/core/ui/TopBar/menu
$:/core/ui/UntaggedTemplate
$:/core/ui/ViewTemplate
$:/core/ui/ViewTemplate/body
$:/core/ui/ViewTemplate/classic
$:/core/ui/ViewTemplate/subtitle
$:/core/ui/ViewTemplate/tags
$:/core/ui/ViewTemplate/title
$:/core/ui/ViewToolbar/close
$:/core/ui/ViewToolbar/edit
$:/core/ui/ViewToolbar/info
$:/core/wiki/title
$:/DefaultTiddlers
$:/language/BinaryWarning/Prompt
$:/language/Buttons/AdvancedSearch/Caption
$:/language/Buttons/AdvancedSearch/Hint
$:/language/Buttons/Cancel/Caption
$:/language/Buttons/Cancel/Hint
$:/language/Buttons/Close/Caption
$:/language/Buttons/Close/Hint
$:/language/Buttons/ControlPanel/Caption
$:/language/Buttons/ControlPanel/Hint
$:/language/Buttons/Delete/Caption
$:/language/Buttons/Delete/Hint
$:/language/Buttons/Edit/Caption
$:/language/Buttons/Edit/Hint
$:/language/Buttons/HideSideBar/Caption
$:/language/Buttons/HideSideBar/Hint
$:/language/Buttons/Info/Caption
$:/language/Buttons/Info/Hint
$:/language/Buttons/NewTiddler/Caption
$:/language/Buttons/NewTiddler/Hint
$:/language/Buttons/Save/Caption
$:/language/Buttons/Save/Hint
$:/language/Buttons/SaveWiki/Caption
$:/language/Buttons/SaveWiki/Hint
$:/language/Buttons/ShowSideBar/Caption
$:/language/Buttons/ShowSideBar/Hint
$:/language/ClassicWarning/Hint
$:/language/ClassicWarning/Upgrade/Caption
$:/language/CloseAll/Button
$:/language/ConfirmCancelTiddler
$:/language/ConfirmDeleteTiddler
$:/language/ConfirmEditShadowTiddler
$:/language/ConfirmOverwriteTiddler
$:/language/ControlPanel/Advanced/Caption
$:/language/ControlPanel/Advanced/EditorTypes/Caption
$:/language/ControlPanel/Advanced/EditorTypes/Editor/Caption
$:/language/ControlPanel/Advanced/EditorTypes/Hint
$:/language/ControlPanel/Advanced/EditorTypes/Type/Caption
$:/language/ControlPanel/Advanced/Hint
$:/language/ControlPanel/Advanced/LoadedModules/Caption
$:/language/ControlPanel/Advanced/LoadedModules/Hint
$:/language/ControlPanel/Advanced/Settings/Caption
$:/language/ControlPanel/Advanced/Settings/Hint
$:/language/ControlPanel/Advanced/Settings/NavigationAddressBar/Caption
$:/language/ControlPanel/Advanced/Settings/NavigationAddressBar/Hint
$:/language/ControlPanel/Advanced/Settings/NavigationAddressBar/No/Description
$:/language/ControlPanel/Advanced/Settings/NavigationAddressBar/Permalink/Description
$:/language/ControlPanel/Advanced/Settings/NavigationAddressBar/Permaview/Description
$:/language/ControlPanel/Advanced/Settings/NavigationHistory/Caption
$:/language/ControlPanel/Advanced/Settings/NavigationHistory/Hint
$:/language/ControlPanel/Advanced/Settings/NavigationHistory/No/Description
$:/language/ControlPanel/Advanced/Settings/NavigationHistory/Yes/Description
$:/language/ControlPanel/Advanced/TiddlerFields/Caption
$:/language/ControlPanel/Advanced/TiddlerFields/Hint
$:/language/ControlPanel/Appearance/Caption
$:/language/ControlPanel/Appearance/Hint
$:/language/ControlPanel/Appearance/Palette/Caption
$:/language/ControlPanel/Appearance/Palette/Editor/Clone/Caption
$:/language/ControlPanel/Appearance/Palette/Editor/Clone/Prompt
$:/language/ControlPanel/Appearance/Palette/Editor/Prompt
$:/language/ControlPanel/Appearance/Palette/Editor/Prompt/Modified
$:/language/ControlPanel/Appearance/Palette/Editor/Reset/Caption
$:/language/ControlPanel/Appearance/Palette/HideEditor/Caption
$:/language/ControlPanel/Appearance/Palette/Prompt
$:/language/ControlPanel/Appearance/Palette/ShowEditor/Caption
$:/language/ControlPanel/Appearance/StoryView/Caption
$:/language/ControlPanel/Appearance/StoryView/Prompt
$:/language/ControlPanel/Appearance/Theme/Caption
$:/language/ControlPanel/Appearance/Theme/Prompt
$:/language/ControlPanel/Basics/AnimDuration/Prompt
$:/language/ControlPanel/Basics/Caption
$:/language/ControlPanel/Basics/DefaultTiddlers/BottomHint
$:/language/ControlPanel/Basics/DefaultTiddlers/Prompt
$:/language/ControlPanel/Basics/DefaultTiddlers/TopHint
$:/language/ControlPanel/Basics/Language/Prompt
$:/language/ControlPanel/Basics/OverriddenShadowTiddlers/Prompt
$:/language/ControlPanel/Basics/ShadowTiddlers/Prompt
$:/language/ControlPanel/Basics/Subtitle/Prompt
$:/language/ControlPanel/Basics/SystemTiddlers/Prompt
$:/language/ControlPanel/Basics/Tags/Prompt
$:/language/ControlPanel/Basics/Tiddlers/Prompt
$:/language/ControlPanel/Basics/Title/Prompt
$:/language/ControlPanel/Basics/Username/Prompt
$:/language/ControlPanel/Basics/Version/Prompt
$:/language/ControlPanel/Plugins/Caption
$:/language/ControlPanel/Plugins/Fields/Description
$:/language/ControlPanel/Plugins/Fields/Title
$:/language/ControlPanel/Plugins/Fields/Version
$:/language/ControlPanel/Plugins/Language/Prompt
$:/language/ControlPanel/Plugins/Plugin/Prompt
$:/language/ControlPanel/Plugins/Theme/Prompt
$:/language/ControlPanel/Saving/AutoSave
$:/language/ControlPanel/Saving/AutoSave/Disabled/Button
$:/language/ControlPanel/Saving/AutoSave/Disabled/Prompt
$:/language/ControlPanel/Saving/AutoSave/Enabled/Button
$:/language/ControlPanel/Saving/AutoSave/Enabled/Prompt
$:/language/ControlPanel/Saving/Caption
$:/language/ControlPanel/Saving/Heading
$:/language/ControlPanel/Saving/TiddlySpot/Advanced/Heading
$:/language/ControlPanel/Saving/TiddlySpot/BackupDir
$:/language/ControlPanel/Saving/TiddlySpot/Backups
$:/language/ControlPanel/Saving/TiddlySpot/Filename
$:/language/ControlPanel/Saving/TiddlySpot/Heading
$:/language/ControlPanel/Saving/TiddlySpot/Hint
$:/language/ControlPanel/Saving/TiddlySpot/Password
$:/language/ControlPanel/Saving/TiddlySpot/ServerURL
$:/language/ControlPanel/Saving/TiddlySpot/UploadDir
$:/language/ControlPanel/Saving/TiddlySpot/UserName
$:/language/ControlPanel/Tools/Caption
$:/language/ControlPanel/Tools/Download/Full/Caption
$:/language/ControlPanel/Tools/Encryption/ChangePassword/Button
$:/language/ControlPanel/Tools/Encryption/ClearPassword/Button
$:/language/ControlPanel/Tools/Encryption/Disabled/Prompt
$:/language/ControlPanel/Tools/Encryption/Enabled/Prompt
$:/language/ControlPanel/Tools/Encryption/Heading
$:/language/ControlPanel/Tools/Encryption/SetPassword/Button
$:/language/ControlPanel/Tools/Export/AllAsStaticHTML/Caption
$:/language/ControlPanel/Tools/Export/Heading
$:/language/ControlPanel/Tools/Import/Heading
$:/language/ControlPanel/Tools/Import/Hint
$:/language/ControlPanel/Tools/Import/Prompt
$:/language/Docs/Fields/_canonical_uri
$:/language/Docs/Fields/bag
$:/language/Docs/Fields/caption
$:/language/Docs/Fields/color
$:/language/Docs/Fields/component
$:/language/Docs/Fields/created
$:/language/Docs/Fields/creator
$:/language/Docs/Fields/current-tiddler
$:/language/Docs/Fields/dependents
$:/language/Docs/Fields/description
$:/language/Docs/Fields/draft.of
$:/language/Docs/Fields/draft.title
$:/language/Docs/Fields/footer
$:/language/Docs/Fields/hack-to-give-us-something-to-compare-against
$:/language/Docs/Fields/icon
$:/language/Docs/Fields/library
$:/language/Docs/Fields/list
$:/language/Docs/Fields/list-after
$:/language/Docs/Fields/list-before
$:/language/Docs/Fields/modified
$:/language/Docs/Fields/modifier
$:/language/Docs/Fields/name
$:/language/Docs/Fields/plugin-priority
$:/language/Docs/Fields/plugin-type
$:/language/Docs/Fields/released
$:/language/Docs/Fields/revision
$:/language/Docs/Fields/source
$:/language/Docs/Fields/subtitle
$:/language/Docs/Fields/tags
$:/language/Docs/Fields/text
$:/language/Docs/Fields/title
$:/language/Docs/Fields/type
$:/language/Docs/Fields/version
$:/language/Docs/ModuleTypes/animation
$:/language/Docs/ModuleTypes/command
$:/language/Docs/ModuleTypes/config
$:/language/Docs/ModuleTypes/filteroperator
$:/language/Docs/ModuleTypes/global
$:/language/Docs/ModuleTypes/isfilteroperator
$:/language/Docs/ModuleTypes/macro
$:/language/Docs/ModuleTypes/parser
$:/language/Docs/ModuleTypes/saver
$:/language/Docs/ModuleTypes/startup
$:/language/Docs/ModuleTypes/storyview
$:/language/Docs/ModuleTypes/tiddlerdeserializer
$:/language/Docs/ModuleTypes/tiddlerfield
$:/language/Docs/ModuleTypes/tiddlermethod
$:/language/Docs/ModuleTypes/utils
$:/language/Docs/ModuleTypes/utils-node
$:/language/Docs/ModuleTypes/widget
$:/language/Docs/ModuleTypes/wikimethod
$:/language/Docs/ModuleTypes/wikirule
$:/language/Docs/PaletteColours/alert-background
$:/language/Docs/PaletteColours/alert-border
$:/language/Docs/PaletteColours/alert-highlight
$:/language/Docs/PaletteColours/alert-muted-foreground
$:/language/Docs/PaletteColours/background
$:/language/Docs/PaletteColours/blockquote-bar
$:/language/Docs/PaletteColours/code-background
$:/language/Docs/PaletteColours/code-border
$:/language/Docs/PaletteColours/code-foreground
$:/language/Docs/PaletteColours/download-background
$:/language/Docs/PaletteColours/download-foreground
$:/language/Docs/PaletteColours/dragger-background
$:/language/Docs/PaletteColours/dragger-foreground
$:/language/Docs/PaletteColours/dropdown-background
$:/language/Docs/PaletteColours/dropdown-border
$:/language/Docs/PaletteColours/dropdown-tab-background
$:/language/Docs/PaletteColours/dropdown-tab-background-selected
$:/language/Docs/PaletteColours/dropzone-background
$:/language/Docs/PaletteColours/external-link-background
$:/language/Docs/PaletteColours/external-link-background-hover
$:/language/Docs/PaletteColours/external-link-background-visited
$:/language/Docs/PaletteColours/external-link-foreground
$:/language/Docs/PaletteColours/external-link-foreground-hover
$:/language/Docs/PaletteColours/external-link-foreground-visited
$:/language/Docs/PaletteColours/foreground
$:/language/Docs/PaletteColours/message-background
$:/language/Docs/PaletteColours/message-border
$:/language/Docs/PaletteColours/message-foreground
$:/language/Docs/PaletteColours/modal-backdrop
$:/language/Docs/PaletteColours/modal-background
$:/language/Docs/PaletteColours/modal-border
$:/language/Docs/PaletteColours/modal-footer-background
$:/language/Docs/PaletteColours/modal-footer-border
$:/language/Docs/PaletteColours/modal-header-border
$:/language/Docs/PaletteColours/muted-foreground
$:/language/Docs/PaletteColours/notification-background
$:/language/Docs/PaletteColours/notification-border
$:/language/Docs/PaletteColours/page-background
$:/language/Docs/PaletteColours/pre-background
$:/language/Docs/PaletteColours/pre-border
$:/language/Docs/PaletteColours/primary
$:/language/Docs/PaletteColours/sidebar-button-foreground
$:/language/Docs/PaletteColours/sidebar-controls-foreground
$:/language/Docs/PaletteColours/sidebar-controls-foreground-hover
$:/language/Docs/PaletteColours/sidebar-foreground
$:/language/Docs/PaletteColours/sidebar-foreground-shadow
$:/language/Docs/PaletteColours/sidebar-muted-foreground
$:/language/Docs/PaletteColours/sidebar-muted-foreground-hover
$:/language/Docs/PaletteColours/sidebar-tab-background
$:/language/Docs/PaletteColours/sidebar-tab-background-selected
$:/language/Docs/PaletteColours/sidebar-tab-border
$:/language/Docs/PaletteColours/sidebar-tab-border-selected
$:/language/Docs/PaletteColours/sidebar-tab-divider
$:/language/Docs/PaletteColours/sidebar-tab-foreground
$:/language/Docs/PaletteColours/sidebar-tab-foreground-selected
$:/language/Docs/PaletteColours/sidebar-tiddler-link-foreground
$:/language/Docs/PaletteColours/sidebar-tiddler-link-foreground-hover
$:/language/Docs/PaletteColours/static-alert-foreground
$:/language/Docs/PaletteColours/tab-background
$:/language/Docs/PaletteColours/tab-background-selected
$:/language/Docs/PaletteColours/tab-border
$:/language/Docs/PaletteColours/tab-border-selected
$:/language/Docs/PaletteColours/tab-divider
$:/language/Docs/PaletteColours/tab-foreground
$:/language/Docs/PaletteColours/tab-foreground-selected
$:/language/Docs/PaletteColours/table-border
$:/language/Docs/PaletteColours/table-footer-background
$:/language/Docs/PaletteColours/table-header-background
$:/language/Docs/PaletteColours/tag-background
$:/language/Docs/PaletteColours/tag-foreground
$:/language/Docs/PaletteColours/tiddler-background
$:/language/Docs/PaletteColours/tiddler-border
$:/language/Docs/PaletteColours/tiddler-controls-foreground
$:/language/Docs/PaletteColours/tiddler-controls-foreground-hover
$:/language/Docs/PaletteColours/tiddler-controls-foreground-selected
$:/language/Docs/PaletteColours/tiddler-editor-background
$:/language/Docs/PaletteColours/tiddler-editor-border
$:/language/Docs/PaletteColours/tiddler-editor-border-image
$:/language/Docs/PaletteColours/tiddler-editor-fields-even
$:/language/Docs/PaletteColours/tiddler-editor-fields-odd
$:/language/Docs/PaletteColours/tiddler-info-background
$:/language/Docs/PaletteColours/tiddler-info-border
$:/language/Docs/PaletteColours/tiddler-info-tab-background
$:/language/Docs/PaletteColours/tiddler-link-background
$:/language/Docs/PaletteColours/tiddler-link-foreground
$:/language/Docs/PaletteColours/tiddler-subtitle-foreground
$:/language/Docs/PaletteColours/tiddler-title-foreground
$:/language/Docs/PaletteColours/toolbar-cancel-button
$:/language/Docs/PaletteColours/toolbar-close-button
$:/language/Docs/PaletteColours/toolbar-delete-button
$:/language/Docs/PaletteColours/toolbar-done-button
$:/language/Docs/PaletteColours/toolbar-edit-button
$:/language/Docs/PaletteColours/toolbar-info-button
$:/language/Docs/PaletteColours/toolbar-new-button
$:/language/Docs/PaletteColours/toolbar-options-button
$:/language/Docs/PaletteColours/toolbar-save-button
$:/language/Docs/PaletteColours/untagged-background
$:/language/Docs/PaletteColours/very-muted-foreground
$:/language/Docs/Types/application/javascript
$:/language/Docs/Types/application/json
$:/language/Docs/Types/application/x-tiddler-dictionary
$:/language/Docs/Types/image/gif
$:/language/Docs/Types/image/jpeg
$:/language/Docs/Types/image/png
$:/language/Docs/Types/image/svg+xml
$:/language/Docs/Types/image/x-icon
$:/language/Docs/Types/text/css
$:/language/Docs/Types/text/html
$:/language/Docs/Types/text/plain
$:/language/Docs/Types/text/vnd.tiddlywiki
$:/language/Docs/Types/text/x-tiddlywiki
$:/language/EditTemplate/Body/External/Hint
$:/language/EditTemplate/Body/Hint
$:/language/EditTemplate/Body/Placeholder
$:/language/EditTemplate/Body/Preview/Button/Hide
$:/language/EditTemplate/Body/Preview/Button/Show
$:/language/EditTemplate/Fields/Add/Button
$:/language/EditTemplate/Fields/Add/Name/Placeholder
$:/language/EditTemplate/Fields/Add/Prompt
$:/language/EditTemplate/Fields/Add/Value/Placeholder
$:/language/EditTemplate/Shadow/OverriddenWarning
$:/language/EditTemplate/Shadow/Warning
$:/language/EditTemplate/Tags/Add/Button
$:/language/EditTemplate/Tags/Add/Placeholder
$:/language/EditTemplate/Type/Placeholder
$:/language/EditTemplate/Type/Prompt
$:/language/Filters/AllTags
$:/language/Filters/AllTiddlers
$:/language/Filters/Drafts
$:/language/Filters/Missing
$:/language/Filters/Orphans
$:/language/Filters/OverriddenShadowTiddlers
$:/language/Filters/RecentTiddlers
$:/language/Filters/ShadowTiddlers
$:/language/Filters/SystemTags
$:/language/Filters/SystemTiddlers
$:/language/Help/build
$:/language/Help/clearpassword
$:/language/Help/default
$:/language/Help/help
$:/language/Help/init
$:/language/Help/load
$:/language/Help/notfound
$:/language/Help/output
$:/language/Help/password
$:/language/Help/rendertiddler
$:/language/Help/rendertiddlers
$:/language/Help/savetiddler
$:/language/Help/savetiddlers
$:/language/Help/server
$:/language/Help/setfield
$:/language/Help/verbose
$:/language/Help/version
$:/language/InvalidFieldName
$:/language/MissingTiddler/Hint
$:/language/Modals/Download
$:/language/Modals/SaveInstructions
$:/language/Notifications/Save/Done
$:/language/Notifications/Save/Starting
$:/language/RecentChanges/DateFormat
$:/language/RelativeDate/Future/Days
$:/language/RelativeDate/Future/Hours
$:/language/RelativeDate/Future/Minutes
$:/language/RelativeDate/Future/Months
$:/language/RelativeDate/Future/Second
$:/language/RelativeDate/Future/Seconds
$:/language/RelativeDate/Future/Years
$:/language/RelativeDate/Past/Days
$:/language/RelativeDate/Past/Hours
$:/language/RelativeDate/Past/Minutes
$:/language/RelativeDate/Past/Months
$:/language/RelativeDate/Past/Second
$:/language/RelativeDate/Past/Seconds
$:/language/RelativeDate/Past/Years
$:/language/Search/Filter/Caption
$:/language/Search/Filter/Hint
$:/language/Search/Filter/Matches
$:/language/Search/Matches
$:/language/Search/Shadows/Caption
$:/language/Search/Shadows/Hint
$:/language/Search/Shadows/Matches
$:/language/Search/Standard/Caption
$:/language/Search/Standard/Hint
$:/language/Search/Standard/Matches
$:/language/Search/System/Caption
$:/language/Search/System/Hint
$:/language/Search/System/Matches
$:/language/SideBar/All/Caption
$:/language/SideBar/Contents/Caption
$:/language/SideBar/Drafts/Caption
$:/language/SideBar/Missing/Caption
$:/language/SideBar/More/Caption
$:/language/SideBar/Open/Caption
$:/language/SideBar/Orphans/Caption
$:/language/SideBar/Recent/Caption
$:/language/SideBar/Shadows/Caption
$:/language/SideBar/System/Caption
$:/language/SideBar/Tags/Caption
$:/language/SideBar/Tags/TagManager/Caption
$:/language/SideBar/Tags/Untagged/Caption
$:/language/SideBar/Tools/Caption
$:/language/SideBar/Types/Caption
$:/language/SystemTiddler/Tooltip
$:/language/TagManager/Colour/Heading
$:/language/TagManager/Count/Heading
$:/language/TagManager/Icon/Heading
$:/language/TagManager/Tag/Heading
$:/language/TiddlerInfo/Advanced/Caption
$:/language/TiddlerInfo/Advanced/PluginInfo/Empty/Hint
$:/language/TiddlerInfo/Advanced/PluginInfo/Heading
$:/language/TiddlerInfo/Advanced/PluginInfo/Hint
$:/language/TiddlerInfo/Advanced/ShadowInfo/Heading
$:/language/TiddlerInfo/Advanced/ShadowInfo/NotShadow/Hint
$:/language/TiddlerInfo/Advanced/ShadowInfo/OverriddenShadow/Hint
$:/language/TiddlerInfo/Advanced/ShadowInfo/Shadow/Hint
$:/language/TiddlerInfo/Advanced/ShadowInfo/Shadow/Source
$:/language/TiddlerInfo/Fields/Caption
$:/language/TiddlerInfo/List/Caption
$:/language/TiddlerInfo/List/Empty
$:/language/TiddlerInfo/Listed/Caption
$:/language/TiddlerInfo/Listed/Empty
$:/language/TiddlerInfo/References/Caption
$:/language/TiddlerInfo/References/Empty
$:/language/TiddlerInfo/Tagging/Caption
$:/language/TiddlerInfo/Tagging/Empty
$:/languages/en-GB
$:/palette
$:/palettes/Blanca
$:/palettes/Blue
$:/palettes/Contrast
$:/palettes/Muted
$:/palettes/Rocker
$:/palettes/Vanilla
$:/plugins/tiddlywiki/cecily/cecily.js
$:/plugins/tiddlywiki/fullscreen/init.js
$:/plugins/tiddlywiki/github-fork-ribbon/readme
$:/plugins/tiddlywiki/github-fork-ribbon/styles
$:/plugins/tiddlywiki/googleanalytics/googleanalytics.js
$:/SiteSubtitle
$:/SiteTitle
$:/snippets/allfields
$:/snippets/autosavestatus
$:/snippets/currpalettepreview
$:/snippets/download-wiki-button
$:/snippets/encryptionstatus
$:/snippets/languageswitcher
$:/snippets/minilanguageswitcher
$:/snippets/minithemeswitcher
$:/snippets/modules
$:/snippets/paletteeditor
$:/snippets/palettepreview
$:/snippets/paletteswitcher
$:/snippets/recentchanges
$:/snippets/themeswitcher
$:/snippets/viewswitcher
$:/TagManager
$:/tags/AdvancedSearch
$:/tags/ControlPanel
$:/tags/EditTemplate
$:/tags/EditToolbar
$:/tags/MoreSideBar
$:/tags/PageControls
$:/tags/PageTemplate
$:/tags/SideBar
$:/tags/TiddlerInfo
$:/tags/TiddlerInfo/Advanced
$:/tags/ViewTemplate
$:/tags/ViewToolbar
$:/temp/advancedsearch
$:/temp/search
$:/themes/tiddlywiki/snowwhite/base
$:/themes/tiddlywiki/vanilla/base
$:/themes/tiddlywiki/vanilla/metrics
$:/themes/tiddlywiki/vanilla/reset
$:/themes/tiddlywiki/vanilla/settings
$:/themes/tiddlywiki/vanilla/themetweaks
$:/view
GettingStarted

Sharing a TiddlyWiki on Dropbox

4 months ago

You can work on a TiddlyWiki file in Dropbox and publish a URL that anyone can use to see a read-only view of the file.

  1. Save your TiddlyWiki file within your Dropbox folder
  2. Select Dropbox's "Share Link" option to obtain a public URL for the file
    • In the Dropbox web interface, this is done by clicking the link icon that appears when you hover over a file. Dropbox also adds a "Share Link" item to the file context menu in Finder on OS X and Explorer on Windows
  3. The URL generated by Dropbox will have this form:

    https://www.dropbox.com/s/<gobbledegook>/mywiki.html

  4. Modify the URL like this, carefully preserving the gobbledegook:

    https://dl.dropboxusercontent.com/s/<gobbledegook>/mywiki.html

The result is a "secret" URL that you can send to other people to enable them to see the wiki.

SingleFileApplication

4 months ago

A single file application is a web application where all of the assets are delivered in a single static file. This means that it can be downloaded and used offline without losing functionality. It can also be hosted on almost any type of web server.

TiddlyWiki is an unusual single file application because it stores its data within the same file, and is capable of saving changes to itself.

Every single file application must also by definition be a SinglePageApplication, but the converse is not true.

SinglePageApplication

10 months ago

As defined by Wikipedia, a SinglePageApplication is a web application that presents itself as a single HTML document that dynamically loads additional content as the user browses the site. Frequently, single page applications are carefully designed to hide their nature, appearing and functioning as an ordinary static website by respecting the address bar and the back/forward navigation controls.

Unusually, TiddlyWiki is also a SingleFileApplication.

Startup Modules.svg

StartupMechanism

52 days ago

The startup mechanism runs the installed startup modules at the end of the boot process.

Startup Modules

Modules with their module-type field set to startup:

  • Must export a startup function
    • For synchronous startup modules the startup function is called as startup(), asynchronous modules are passed a callback they must invoke on completion: startup(callback)
  • May export a name property that is used to identify the task
  • May export a after property containing an array of names of dependent tasks that must be run before this one
  • May export a before property containing an array of names of tasks that must be run after this one
  • May export a platforms property containing an array of names of platforms that are required in order for the startup module to be executed. The defined platforms are node and browser. If the platforms property is not provided it defaults to ["node","browser"]

Startup Processing

Startup modules are executed in sequence according to their declared dependencies.

There is no guarantee of the execution order of tasks that share the same dependencies.

Startup Modules

The core defines the following startup modules:

StateMechanism

5 months ago

The StateMechanism in TiddlyWiki is at the heart of how complex user interfaces can be built from WikiText.

In the browser, the TiddlyWiki display is produced by dynamically rendering the tiddler $:/core/ui/PageTemplate. Through various transclusions and other widgets it renders the entire user interface. The dynamic rendering is accomplished by a mechanism called "binding": any changes to the tiddlers in the store are dynamically reflected in the browser display.

The stack of templates that make up the TiddlyWiki display are complex but we'll focus on the line that displays the main story column:

<$list filter="[list[$:/StoryList]]" history="$:/HistoryList" template="$:/core/ui/ViewTemplate" editTemplate="$:/core/ui/EditTemplate" storyview={{$:/view}} />

Breaking down the attributes applied to the list widget:

  • filter: selects the list of tiddlers in the list field of the tiddler $:/StoryList. If a tiddler is added or removed from that list then it is automatically reflected in the displayed list
  • history: references the tiddler to be used to store the history stack (see the NavigationMechanism)
  • template: identifies a template tiddler to be used for rendering each tiddler in the list
  • editTemplate: identifies a different template tiddler to be used for rendering tiddlers that are in draft mode
  • storyview: specifies the story view to be used (eg classic, or zoomin)

The $:/StoryList tiddler is an example of a StateTiddler: a tiddler that is used to hold the state of the user interface. Changes to the user interface are made indirectly, by changing the underlying state tiddlers, and letting TiddlyWiki ripple the changes through the user interface.

Note how this approach makes the open tab in the sidebar very easy to implement: it is just another list widget referencing the same state tiddler, but with a different template:

<$list filter="[list[$:/StoryList]]" history="$:/HistoryList" storyview="pop">
<$button message="tw-close-tiddler" class="btn-invisible btn-mini">&times;</$button> <$link to={{!!title}}><$view field="title"/></$link>
</$list>

Now consider the implementation of the info panel within the tiddler template. We want to be able to toggle the info panel open and closed, which means that we must track its current state in a tiddler.

However, we can't track the state in a tiddler called, say, $:/InfoPanelState because every tiddler would share the same state; changing the value of the tiddler would affect all tiddlers displayed in the story.

The solution is to dynamically generate a unique title for each state tiddler that we need. We need to ensure that the same state tiddler title is generated each time a user interface element is rendered. To do that, we append together tokens representating each of the stack of transclusions that led to the current rendering location. Then that string of symbols is hashed to a simple numeric value.

The process of generating a state tiddler title is encapsulated in the QualifyMacro.

Structuring TiddlyWiki

6 months ago

TiddlyWiki5 provides several features to help you structure information as tiddlers, and model the relationships between them:

Styles and Classes in WikiText

6 months ago

You can use this construction to cause the wrapped content to be assigned specified CSS classes or styles:

Similar syntax is used to assign styles. For example:

Multiple styles and classes can be mixed. For example:

SyncAdaptorModules

6 months ago

Introduction

SyncAdaptorModules encapsulate storage mechanisms that can be used by the SyncMechanism. Two examples are:

SyncAdaptorModules are represented as JavaScript tiddlers with the field module-type set to syncadaptor.

Exports

The following properties should be exposed via the exports object:

PropertyDescription
adaptorClassThe JavaScript class for the adaptor

Nothing should be exported if the adaptor detects that it isn't capable of operating successfully (eg, because it only runs on either the browser or the server, or because a dependency is missing).

Adaptor Module Methods

Adaptor modules must handle the following methods.

Constructor(syncer)

Initialises a new adaptor instance.

ParameterDescription
syncerSyncer object that is using this adaptor

getTiddlerInfo(tiddler)

Gets the supplemental information that the adaptor needs to keep track of for a particular tiddler. For example, the TiddlyWeb adaptor includes a bag field indicating the original bag of the tiddler.

ParameterDescription
tiddlerTarget tiddler

Returns an object storing any additional information required by the adaptor.

getStatus(callback)

Retrieves status information from the server. This method is optional.

ParameterDescription
callbackCallback function invoked with parameters err,isLoggedIn,username

login(username,password,callback)

Attempts to login to the server with specified credentials. This method is optional.

ParameterDescription
usernameUsername
passwordPassword
callbackCallback function invoked with parameter err

logout(callback)

Attempts to logout of the server. This method is optional.

ParameterDescription
callbackCallback function invoked with parameter err

getSkinnyTiddlers(callback)

Retrieves a list of skinny tiddlers from the server.

This method is optional. If an adaptor doesn't implement it then synchronisation will be unidirectional from the TiddlyWiki store to the adaptor, but not the other way.

ParameterDescription
callbackCallback function invoked with parameter err,tiddlers, where tiddlers is an array of tiddler field objects

saveTiddler(tiddler,callback)

Saves a tiddler to the server.

ParameterDescription
tiddlerTiddler to be saved
callbackCallback function invoked with parameter err,adaptorInfo,revision

loadTiddler(title,callback)

Loads a tiddler from the server.

ParameterDescription
titleTitle of tiddler to be retrieved
callbackCallback function invoked with parameter err,tiddlerFields

deleteTiddler(title,callback)

Delete a tiddler from the server.

ParameterDescription
titleTitle of tiddler to be deleted
callbackCallback function invoked with parameter err

SystemTags

5 months ago

System tags are used to give special behaviour to tiddlers:

System tags in use

These are the system tags in use in this wiki:

$:/tags/AdvancedSearch
$:/tags/ControlPanel
$:/tags/ControlPanel/Advanced
$:/tags/ControlPanel/Advanced/Settings
$:/tags/ControlPanel/Appearance
$:/tags/EditTemplate
$:/tags/EditToolbar
$:/tags/Filter
$:/tags/Image
$:/tags/Macro
$:/tags/MoreSideBar
$:/tags/PageControls
$:/tags/PageTemplate
$:/tags/Palette
$:/tags/SideBar
$:/tags/stylesheet
$:/tags/TiddlerInfo
$:/tags/TiddlerInfo/Advanced
$:/tags/TopRightBar
$:/tags/ViewTemplate
$:/tags/ViewToolbar

SystemTiddlers

System tiddlers are any tiddler whose title starts with $:/; such tiddlers are automatically hidden from most operations. They don't show up in lists or search results, but linking to one directly works in the usual way.

TiddlyWiki models everything as tiddlers, including its internal components and configuration. Thus, even an apparently empty TiddlyWiki actually contains dozens of tiddlers that are necessary to enable it function correctly. Using system tiddlers prevents them from confusing casual users.

The current system tiddlers are:

$:/_tw5.com-styles
$:/boot/boot.css
$:/boot/boot.js
$:/boot/bootprefix.js
$:/config/OriginalTiddlerPaths
$:/core
$:/core/templates/static.content
$:/CurvedText
$:/DefaultTiddlers
$:/editions/tw5.com/download-empty
$:/editions/tw5.com/github-fork-ribbon
$:/editions/tw5.com/snippets/download-empty-button
$:/editions/tw5.com/TiddlerInfo/Sources
$:/editions/tw5.com/wikitext-macros
$:/favicon.ico
$:/GoogleAnalyticsAccount
$:/GoogleAnalyticsDomain
$:/green_favicon.ico
$:/HistoryList
$:/isEncrypted
$:/language
$:/languages/de-AT
$:/languages/de-DE
$:/languages/fr-FR
$:/languages/it-IT
$:/languages/ja-JP
$:/languages/zh-Hans
$:/languages/zh-Hant
$:/library/sjcl.js
$:/plugins/tiddlywiki/cecily
$:/plugins/tiddlywiki/fullscreen
$:/plugins/tiddlywiki/github-fork-ribbon
$:/plugins/tiddlywiki/googleanalytics
$:/plugins/tiddlywiki/nodewebkitsaver
$:/SiteSubtitle
$:/SiteTitle
$:/StaticBanner
$:/StoryList
$:/SVGExampleRadius
$:/theme
$:/themes/tiddlywiki/centralised
$:/themes/tiddlywiki/readonly
$:/themes/tiddlywiki/seamless
$:/themes/tiddlywiki/snowwhite
$:/themes/tiddlywiki/starlight
$:/themes/tiddlywiki/stickytitles
$:/themes/tiddlywiki/vanilla

TableOfContents

  1. Guide
  2. Reference
  3. Advanced
  4. About

Tables in WikiText

4 months ago

Basics

TiddlyWiki5 formats tables using vertical bar characters like so:

|!Cell1 |!Cell2 |
|Cell3 |Cell3 |

Exclamation marks are used to indicate header cells. The example renders as:

Cell1Cell2
Cell3Cell3

Cell Alignment

Table cell alignment is controlled by inserting space characters before and/or after the cell content. For example:

|Left aligned content |
| Right aligned content|
| Centred content |
|+++ a very wide column so we can see the alignment +++|

The example renders as:

Left aligned content
Right aligned content
Centred content
+++ a very wide column so we can see the alignment +++

Cell vertical Alignment

Vertical alignment of cells is done by inserting either a ^ for top alignment or a , for bottom alignment as the first character of a cell. The normal horizontal alignment is still possible. For example:

|^top left |^ top center |^ top right|
|middle left | middle center | middle right|
|,bottom left |, bottom center |, bottom right|

The example renders as:

:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::
::
top lefttop centertop right::
::
::
::
middle leftmiddle centermiddle right::
::
::
::
bottom leftbottom centerbottom right::
::
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

If you need to have a ^or a , as the first character of a left aligned cell, you can use HTML escaping:

^&#94;
,&#44;

Cell Merging

To merge a table cell with the one above, use the special cell text ~. To merge a cell with the one to its left use the text <. To merge one to its right use >. For example:

|Cell1 |Cell2 |Cell3 |Cell4 |
|Cell5 |Cell6 |Cell7 |<|
|Cell5 |~|Cell7 |Cell8 |
|>|Cell9 |Cell10 |Cell11 |

Renders as:

Cell1Cell2Cell3Cell4
Cell5Cell6Cell7
Cell5Cell7Cell8
Cell9Cell10Cell11

Table Classes, Captions, Headers and Footers

Table CSS classes, captions, headers and footers can be specified as special pseudo-rows:

|myclass anotherClass|k
|This is a caption |c
|Cell1 |Cell2 |
|Cell3 |Cell3 |
|Header|Header|h
|Footer|Footer|f

Renders as:

This is a caption
Cell1Cell2
Cell3Cell3
HeaderHeader
FooterFooter

TabsMacro

45 days ago

The tabs macro displays a list of tiddlers as a tab control. The user can switch between tabs by clicking on them. The tabs are labelled with the title of the corresponding tiddler, unless there is a caption field present in which case it is used instead.

By default the tab control arranges the tabs horizontally with the content underneath. You can also choose to have the tabs arranged vertically by passing the class tw-vertical.

Parameters

PositionNameDescriptionDefault
1sttabsListFilter giving the tiddlers to be displayed
2nddefaultName of the tiddler containing the default tab
3rdstateString to distinguish multiple tabs within the same tiddler (use of the system tiddler prefix is recommended)$:/state/tab
4thclassAdditional CSS classes for the three wrappers DIV of the tab

Examples

Here is an example of the tabs macro:

<<tabs "Docs WikiText Features RoadMap" "WikiText" "$:/state/tab1">>

TalkyTalky

9 months ago

http://tiddlywiki.com/

Jeremy Ruston

@TiddlyWiki & @Jermolene

TiddlyWiki5 is a JavaScript wiki that can run entirely in the browser, or under Node.js. Internally, it is a representation transformation engine. It parses WikiText and renders it as text, or straight to the DOM with selective refresh to reflect subsequent changes. WikiText is used to render the user interface as well as the content of tiddlers. Once you know how to edit a tiddler you know how to customise TiddlyWiki, with no limits - it's only JavaScript.

Why is TiddlyWiki different? It frees you from the monopoly platforms of the web: store stuff in TW5 and you can pretty much guarantee you'll still have it in 100 years. Freedom, into the far future.

Single-file Edition

Store your tiddlers in a single HTML file along with the JS

  1. Open http://tiddlywiki.com/
  2. Show reading experience, search and tags
  3. Responsive response to phone and tablet
  4. Open http://tiddlywiki.com/empty.html in Chrome Canary
  5. Create tiddlers, show links, missing, orphans, tags, tagging, references
  6. Use missing tiddlers to find a typo
  7. Show shadow tiddlers and system tiddlers
  8. Show stylesheet handling - $:/themes/tiddlywiki/vanilla/base
  9. Drag an image from the file system
  10. Use the image in a tiddler
  11. Edit the image
  12. Click Save, select file destination
  13. Open file in text editor, see content within it
  14. Note that saving technique works in virtually all browsers
  15. Set password
  16. Click Save again, click accept
  17. Open file in text editor, verify content is encrypted
  18. Open saved file in Firefox, show TiddlyFox dialogue
  19. Enter password to decrypt
  20. Start adding tasks
  21. Save using TiddlyFox, refresh to show changes
  22. Drag in the task tiddlers
  23. Drag in TaskManagementExample, show source

Node.js Edition

Store your tiddlers in separate files in a chain of linked directories.

  1. Run ./bld.sh
  2. Open http://tiddlywiki.com/static.html
    • Click links to show individual tiddlers
  3. Open http://tiddlywiki.com/test.html
  4. Start ./serve.sh UserName
  5. Open http://0.0.0.0:8080/
  6. Open network console
  7. Note same sync code on client and server

Wrap-up

  1. This is the start of a 25-year journey to perfect a tool that anyone can user forever
  2. Open https://github.com/Jermolene/TiddlyWiki5
  3. TiddlyWiki looking for sponsorship
  4. Open http://federatial.com/
  5. Federatial looking for opportunities to adapt TW5 for corporate use

Below the line...

API

  1. Open dev tools console
    • $tw.wiki.deleteTiddler("HelloThere")
    • $tw.wiki.addTiddler({title: "HelloThere", text: "This is a new [[Tiddler]], linking to a TiddlerThatDoesntCurrentlyExist"})
    • $tw.wiki.getTiddlerLinks("HelloThere")
    • $tw.wiki.filterTiddlers("[tag[mechanism]sort[modified]]")

Saving online

  1. Open http://tiddlyspot.com/
  2. Simple PHP scripts
  3. Show TiddlySpot integration

Server integration with TiddlyWeb/TiddlySpace

  1. Open http://tw5test.tiddlyspace.com/tw5
  2. Open network console
  3. Show lazy loading

task

9 months ago

Sample tasks for the TaskManagementExample.

TaskManagementExample

9 months ago

TiddlyWiki5 can be used as a simple task management system without further customisation. The idea is that tasks be tagged task, with those that are completed also tagged done. In this way it is straightforward to generate task lists.

Outstanding tasks

Completed tasks

TemplateTiddlers

3 months ago

A template tiddler is not in fact a type of tiddler, it is a role in which a tiddler can be used.

When text is wikified there is the concept of the CurrentTiddler. Certain widgets (like the ViewWidget) can use the current tiddler implicitly. For example:

<$view tiddler="HelloThere" field="myfield"/> - displays the field "myfield" of the tiddler HelloThere
<$view field="myfield"/> - displays the field "myfield" of the current tiddler

When the TranscludeWidget pulls in the content from another tiddler, by default it does not change the current tiddler, so the transcluded content behaves as if it were in the context of the transcluding tiddler.

So, if we have a tiddler "A" that contains:

<$view field="myfield"/>

And then transclude it from a tiddler "B" like so:

My field value is: <$transclude tiddler="A"/>

The result will be that the field from the tiddler "B" is displayed; in other words, tiddler "A" is acting as a template for displaying information from tiddler "B".

The TiddlerWidget is used to change the current tiddler. Consider a tiddler "C" containing:

<$tiddler tiddler="A"><$transclude tiddler="A"/></$tiddler>

It is still transcluding tiddler "A", but now it is also setting the current tiddler to "A". The result is therefore that the field "myfield" for tiddler "A" is displayed.

The shorthand syntax for Transclusion in WikiText actually generates both a TiddlerWidget and a TranscludeWidget.

TestingMechanism

7 months ago

TiddlyWiki5 incorporates the Jasmine JavaScript testing framework (see http://pivotal.github.io/jasmine/). It allows the same tests to be run both in the browser and under Node.js.

TiddlyWiki5 Testing Components

There are two main elements to the TiddlyWiki5 testing mechanism:

  • The plugin tiddlywiki/jasmine that wraps Jasmine up into a plugin along with some glue code
  • The TiddlyWiki5 edition test that contains the core test specifications and includes the Jasmine plugin

Running the Tests in Node.js

To run the tests under Node.js just load up the test wiki:

node ./tiddlywiki.js \
	./editions/test \

Running the Tests in the Browser

To generate a wiki containing the browser tests load up the test wiki and save it as an HTML file:

node ./tiddlywiki.js \
	./editions/test \
	--verbose \
	--rendertiddler $:/core/save/all $TW5_BUILD_OUTPUT/test.html text/plain \

Then, open the test.html file in the browser to see the test results. There is a prebuilt version of test.html at:

http://tiddlywiki.com/test.html

TextReference

7 months ago

A TextReference identifies a chunk of text from a tiddler that can be retrieved or modified depending on the context.

Text references are made up of several parts, most of which can be optional:

  • <tiddler title> - the text field of the specified tiddler
  • <tiddler title>!!<metadata field> - a tiddler metadata field (eg, modified, modifier, type etc)
  • !!<metadata field> - a metadata field of the current tiddler
  • <tiddler title>##<property index> - extracts a named property from DataTiddlers

Text references can be used in several places:

TextWidget

5 months ago

Introduction

The text widget displays plain text.

Content and Attributes

The content of the <$text> widget is not used.

AttributeDescription
textThe text to display

The First Rule of Using TiddlyWiki

24 days ago

Horror Stories

Every so often, TiddlyWiki users report heart-rending tales of personal data loss on the discussion groups:

My entire TiddlyWiki has just been wiped out when Firefox crashed during saving a tiddly.

https://groups.google.com/d/topic/tiddlywiki/oG2L7OXhUoI/discussion

Last time I used it was last night at home on my Windows 7 desktop, hit the check mark to stop editing my last entry, it then saves via TiddlyFox and I eject my USB drive. I came to work this morning, plugged in my USB, enter my TW5 password and it doesn't want to open after several attempts. I browse to my TW5 html file and notice that my file size is no longer 3MB.. instead it is 80KB. This leads me to believe I lost everything.

https://groups.google.com/d/topic/tiddlywiki/SXStDJ0ntGI/discussion

Don't let it happen to you!

The first rule of using TiddlyWiki is:

Backup your data!

TiddlyWiki is a very flexible, customisable system that puts you firmly in charge of your own data. Every care is taken in TiddlyWiki's development to ensure that it is a safe place to preserve your most valuable data but the ultimate responsibility to reduce the risk of data loss falls to users.

The best way to make sure that your data is safe is to practice a rigorous system of backups:

  • Consider using services like Dropbox to continuously back up your personal data to the cloud
  • Retain backups before upgrading to a new version of TiddlyWiki
  • Figure out and protect yourself from the worst case scenarios: what if your USB stick or hard drive fails? What if your computer is hit by a ransomeware virus?
  • Be defensive and redundant: for example, take multiple backups and keep them in separate physical locations

Tiddler Fishes.svg

TiddlerFields

2 months ago

TiddlerFields are name:value pairs that make up a tiddler. Field names must be lowercase letters, digits or the characters - (dash), _ (underscore) and . (period).

The standard fields are:

Field NameReferenceDescription
titleTitleField
textTextField
modifiedModifiedField
modifierModifierField
createdCreatedField
creatorCreatorField
tagsTagsField
typeTypeField
listListField

Other fields used by the core are:

Field NameReferenceDescription
colorColorField
descriptionDescriptionField
draft.ofDraftOfField
draft.titleDraftTitleField
footerFooterField
libraryLibraryField
nameNameField
plugin-priorityPluginPriorityField
plugin-typePluginTypeField
sourceSourceField
subtitleSubtitleField

The TiddlyWebAdaptor uses a few more fields:

Field NameReferenceDescription
bagBagField
revisionRevisionField

See the Advanced > TiddlerFields tab of the control panel for details of the fields used in this wiki.

TiddlerFiles

41 days ago

Tiddlers can be stored in text files in several different formats. Files containing single tiddlers can also have an auxiliary .meta file formatted as a sequence of name:value pairs:

title: TheTitle
modifier: someone

TiddlyWeb-style .tid files

These files consist of a sequence of lines containing name:value pairs, a blank line and then the text of the tiddler. For example:

title: MyTiddler
modifier: Jeremy

This is the text of my tiddler.

Note that many text editors require that files include a terminating newline. If you want to avoid including the terminating newline in the text of the tiddler you can use this alternative syntax:

title: MyTiddler
modifier: Jeremy
text: This is the text of my tiddler.

The ContentType application/x-tiddler is used internally for these files

TiddlyWiki <DIV> .tiddler files

Modern *.tiddler files look like this:

<div title="AnotherExampleStyleSheet" modifier="blaine" created="201102111106" modified="201102111310" tags="examples" creator="psd">
<pre>Note that there is an embedded <pre> tag, and line feeds are not escaped.

And, weirdly, there is no HTML encoding of the body.</pre>
</div>

These *.tiddler files are therefore not quite the same as the tiddlers found inside a TiddlyWiki HTML file, where the body is HTML encoded in the expected way.

Older *.tiddler files more closely matched the store format used by TiddlyWiki at the time:

<div tiddler="AnotherExampleStyleSheet" modifier="JeremyRuston" modified="200508181432" created="200508181432" tags="examples">This is an old-school .tiddler file, without an embedded &lt;pre&gt; tag.\nNote how the body is &quot;HTML encoded&quot; and new lines are escaped to \\n</div>

The ContentType application/x-tiddler-html-div is used internally for these files

TiddlyWeb-style JSON files

These files are a straightforward array of hashmaps of name:value fields. Currently only these known fields are processed: title, text, created, creator, modified, modifier, type and tags.

The ContentType application/json is used internally for these files

TiddlyWiki HTML files

TiddlyWiki HTML files contain a collection of tiddlers encoded in <DIV> format.

TiddlerFilter Formal Grammar

3 months ago

TiddlerFilters follow a formal grammar that is presented here for users who are familiar with the notation. It isn't necessary to understand this grammar in order to write your own filter expressions.

<filter-string> ::= <opt-whitespaces> <filter-operand> | <opt-whitespaces> <filter-operand> <filter-string>

Whitespace is matched with javascript "\s+", which matches space, tab, carriage return, new line, vertical tab, and form feed.

<opt-whitespaces> ::= <opt-whitespace> | <opt-whitespace> <opt-whitespaces>

<opt-whitespace> ::= " " | "\t" | "0xD" | "0xA" | "0xB" | "0xC"

<filter-operand> ::= <opt-operation-prefix> <string-or-operator-list>

<opt-operation-prefix> ::= "+" | "-" | ""

<string-or-operator-list> ::= <operation> | "\"" <string> "\"" | "'" <string> "'" | <string>

<operation> ::= "[" <operator-list> "]"

<operator-list> ::= <operator> | <operator> <operator-list>

<operator> ::= <opt-operator-prefix><operator><operand>

<opt-operator-prefix> ::= "!" | ""

<operator> ::= <operator-name> | <operator-name> ":" <opt-operator-suffix>

<operator-name> ::= "" | "is" | "has" | "each" | "field" ...

<opt-operator-suffix> ::= <string> | ""

<operand> ::= "[" <search-string> "]" | "{" <indirect-search-string> "}" | <regex>

<regex> ::= "/" <string> "/" <opt-regex-args>

<opt-regex-args> ::= "(" <regex-args> ")" | ""

<regex-args> ::= <regex-arg> | <regex-arg> <regex-args>

<regex-arg> ::= "m" | "y" | "g" | "i"

<string> ::= <string-type-1> | <string-type-2> | ...

At the end of parsing you end up with some or all of:

  • <opt-operation-prefix>
  • <opt-operator-prefix>
  • <operator-name>
  • <opt-operator-suffix>, and
  • <operand>

These are used differently by the different operators. For example, the field filter operator supports:

  • <opt-operator-prefix> to negate the result
  • <regex> or <string> operand (note that this must be explicitly supported by each filter operator)
  • <opt-operator-suffix> to specify a fieldname against which to filter

NOTES:

  • The <string> is a terminal that generally supports single- or double- quoted strings which match, respectively, strings of non-single and non-double quotes. Unquoted strings include the extra exclusion of whitespace and square bracket characters.
  • In the case where the <string-or-operator-list> is NOT an <operation> it is treated as the operand passed to the default operator (see next bullet). It is not parsed as a full <operation>.
  • If <operator-name> is the empty string then it will be set to "title" (i.e. the title filter operator is the default operator)
  • Results are collected and each operation is applied in turn. The <opt-operation-prefix> can be used to specify how the corresponding operation is used. Suppose T is the set of all tiddlers, R0 is the current set of results, and Fx is the xth operation. Then:
    • No prefix (""): R0 = R0 U Fx(T) (set union)
    • "-": R0 = R0 - Fx(T) (set difference)
    • "+": R0 = Fx(R0)

Note that <filter-operand>s are not commutative!

  • The parser was simplified by treating regex "/" as a "bracket" of sorts, meaning there could only be a start and end bracket. Thus the regex arguments, like i, are included in parenthesis immediately following the trailing "/".

TiddlerFilters

2 months ago

Filters are used in TiddlyWiki to choose tiddlers by specifying simple match criteria. They are used by widgets like the ListWidget and the CountWidget to perform operations on multiple tiddlers at once.

The most common filter operators are:

See FilterOperators gives a complete list of available filter operators

TiddlerLinks

2 months ago

Links are regions of a tiddler that can be clicked to cause navigation to a different tiddler. The navigation behaviour is determined by the current StoryView; the classic TiddlyWiki view displays the story as a linear sequence of tiddlers.

Holding the control or command key while clicking on a tiddler link opens the target tiddler but doesn't navigate to it. This can be a useful way of queueing up tiddlers to be read later.

Links are useful for modelling organic relationships between tiddlers, and particularly for expressing the navigational paths between tiddlers.

The TiddlerInfoPanel lists incoming links to a tiddler in the tab References.

TiddlerFilters can include the following filter operators that work with links:

  • [links[]] - returns the titles of the tiddlers that are linked from the currently selected tiddler(s)
  • [backlinks[]] - returns the titles of the tiddlers that link to the currently selected tiddler(s)

TiddlyWiki5 alters the appearance of tiddler links to convey additional information about the target of the link:

Link descriptionLink appearance
To a tiddler that existsLikeThis
To a tiddler that doesn't existLikeThis
To a shadow tiddler that has not been overriddenLikeThis
To a shadow tiddler that has been overridden by an ordinary tiddlerLikeThis

External links are shown like this: http://tiddlywiki.com/ or like this.

Tiddlers

3 days ago

Tiddlers are the smallest unit of information in TiddlyWiki. Other systems have analogous concepts with more prosaic names: like "items", "entries", "entities" or "records". Even though "tiddler" is a bit of a preposterous name it has the virtue of being confusingly distinctive rather than confusingly generic.

Internally, tiddlers are an immutable dictionary of name:value pairs called fields. The only field that is required is the title field, but useful tiddlers also have a text field, and some or all of the standard fields listed in TiddlerFields.

TiddlerTags

3 months ago

Introduction

Tiddlers can be assigned categories by assigning one or more tags. For example, tiddlers representing individuals might be tagged friend, family, colleague etc to indicate the relationship to the author.

Multiple tags can be applied to the same tiddler. Used effectively they provide a powerful way to explore content related to a tiddler.

TiddlyWiki offers several useful features based on the convention that a tag itself can be interpreted as the title of a tiddler.

Using Tags

Tags are displayed at the top of the tiddler as coloured pills. Clicking on a tag pill drops down a menu showing links to all the tiddlers that carry that tag, along with a link to the tiddler representing the tag itself.

When editing a tiddler, the tags pills have a small x icon that allows them to be removed individually. There is also a text box to type the name of a new tag to be added, and a dropdown autocomplete list that shows matching tags that are in use.

Tag Manager

The tag manager is available via a button at the top of the sidebar tab "Tabs", or you can link directly to $:/TagManager.

Assigning Colours and Icons to Tag

The colour used to draw a tag pill is taken from the color field of the tiddler titled with the tag. The colour can be specified as any CSS value (more modern browsers show a colour picker for the color field).

An icon can be associated with a tag by placing the title of the tiddler containing the image into the icon field of th etiddler titled with the tag.

See the tag for an example.

Tag Ordering

The ordering used to return a list of the tiddlers with a particular tag is determined by the following rules:

  • First, any tiddlers that are listed in the ListField of the tag tiddler are placed into a new list in the same order
  • Second, any unplaced tiddlers that have the field list-before are placed before the tiddler specified in the field
    • (if the list-before field is empty then the unplaced tiddler is placed at the start of the list)
  • Third, if any unplaced tiddlers have the field list-after then they placed immediately after the tiddler specified in the field
  • Finally, any remaining unplaced tiddlers are placed at the end of the list

System Tags

See SystemTags for information about the special system tags that TiddlyWiki uses for configuration.

TiddlerWidget

5 months ago

Introduction

The TiddlerWidget sets the CurrentTiddler that applies for processing its content.

Content and Attributes

AttributeDescription
tiddlerThe title of the tiddler to become the new CurrentTiddler
classCSS classes to added to the generated elements

TiddlyDesktop

4 months ago

TiddlyDesktop is an app for working with TiddlyWiki files (both TiddlyWikiClassic and TiddlyWiki version 5). It can be installed on Windows, Mac OS X or Linux.

TiddlyDesktop is based on the OpenSource project node-webkit. The source is on GitHub:

https://github.com/Jermolene/TiddlyDesktop/

See Using TiddlyWiki on TiddlyDesktop for instructions.

TiddlyFox

5 months ago

TiddlyFox is an extension for Firefox that allows standalone TiddlyWiki files to save their changes directly to the file system. TiddlyFox works on both desktop and smartphone versions of Firefox. See Saving with TiddlyFox or Saving with TiddlyFox on Android for detailed instructions.

TiddlyFox can be downloaded from the Mozilla Addons site:

https://addons.mozilla.org/en-US/firefox/addon/tiddlyfox/

You can also install the latest development version of TiddlyFox direct from GitHub:

https://github.com/TiddlyWiki/TiddlyFox/raw/master/tiddlyfox.xpi

TiddlyIE

6 months ago

TiddlyIE is an extension for Internet Explorer that allows standalone TiddlyWiki files to save their changes directly to the file system. TiddlyIE works with the desktop version of Internet Explorer.

See Saving with TiddlyIE.

TiddlySpace

9 months ago

TiddlySpace is an environment for discourse on the web, built from TiddlyWeb.

TiddlySpace was originally sponsored by Osmosoft at BT.

TiddlyWeb

9 months ago

TiddlyWeb is a server application that puts Tiddlers on the web:

http://tiddlyweb.com/

TiddlyWeb can be used to host TiddlyWiki and TiddlyWiki5 wikis, making the individual tiddlers available over a flexible HTTP API.

TiddlyWeb was originally sponsored by Osmosoft at BT (along with TiddlySpace).

TiddlyWiki

3 months ago

TiddlyWiki is a rich, interactive tool for manipulating complex data with structure that doesn't easily fit into conventional tools like spreadsheets or wordprocessors.

TiddlyWiki is designed to fit around your brain, helping you deal with the things that won't fit. The fundamental idea is that information is more useful and reusable if we cut it up into the smallest semantically meaningful chunks – tiddlers – and give them titles so that they can be structured with links, tags, lists and macros. Tiddlers use a WikiText notation that concisely represents a wide range of text formatting and hypertext features. TiddlyWiki aims to provide a fluid interface for working with tiddlers, allowing them to be aggregated and composed into longer narratives.

People love using TiddlyWiki. Because it can be used without any complicated server infrastructure, and because it is open source, it has bought unprecedented freedom to people to keep their precious information under their own control. TiddlyWiki was originally created by JeremyRuston and is now a thriving open source project with a busy Community of independent developers.

TiddlyWiki Architecture

9 days ago

The heart of TiddlyWiki is an extensible representation transformation engine for text and images. Given the text of a tiddler and its associated ContentType, the engine can produce a rendering of the tiddler in a new ContentType. Furthermore, it can efficiently selectively update the rendering to track any changes in the tiddler or its dependents.

Overview

The processing pipeline shows how WikiText is parsed by a stack of parse rules into a parse tree. The parse tree is rendered as a tree of widgets, which is synchronised into the DOM via the RefreshMechanism.

DOM events trigger actions on widgets which update the tiddler store. The updates trigger a change event which in turn triggers the refresh mechanism to update the DOM.

Client/Server Architecture

TiddlyWiki Architecture.svg

9 days ago

TiddlyWiki Classic.png

TiddlyWiki Coding Style Guidelines

Motivation

TiddlyWiki is a large project with many interested parties. It benefits everyone if the code is as easy to read as possible. A key part of that it must be written and laid out consistently – the code should read as though it were written by a single author.

Guidelines

Tabs and whitespace

TiddlyWiki uses 4-character tabs for indenting.

One blank line is used to separate blocks of code. Occasional blank lines are permitted within blocks for clarity, but should be avoided unless they solve a specific readability problem.

Layout of basic constructs

See the following example for layout of basic JavaScript constructs:

/*
Multiline comments are used to introduce a block of code such as a function definition
*/
function demoFunction(param,more) {
	// Proper sentence capitalisation for comments
	if(condition == "something") {
		// No space between "if" and the brackets; always spaces around binary operators
		something = somethingElse;
		myOtherFunction(one,two); // No whitespace within function parameters
		do {
			myCondition.explore(); // Always use semicolons
		} while(myCondition < worsens);
	}	
}

Strings

Double quotes are preferred over single quotes for string literals.

TiddlyWiki for Developers

3 months ago

TiddlyWiki is published as OpenSource which means that anyone can read the code and contribute to its development.

Resources

If you're interested in understanding more about the internal operation of TiddlyWiki, TiddlyWiki Architecture gives an overview of how TiddlyWiki is structured. Then read the code – start with the boot kernel $:/boot/boot.js.

The one thing you need to know

TiddlyWiki's architecture is very different from an HTML page written using jQuery. This section concisely explains what TiddlyWiki does differently. It may not make much sense on the first reading.

The key to understanding how it works internally is to see that the RefreshMechanism requires that any region of the DOM can be regenerated at any time. This means that the entire state of the user interface must reside in the tiddler store, from where it is synchronised into the DOM. This is done to improve performance by minimising the DOM interactions during the refresh cycles.

It also determines the standard UI flow:

  1. An event handler on a widget is triggered
  2. The event handler can manipulate the DOM nodes directly created by the widget, and/or modify the state of the tiddler store
  3. The core then issues a store change event which triggers the refresh cycle
  4. Each widget in the tree then gets a chance to refresh itself to reflect the changes in the store if they need to

From a technical perspective, TiddlyWiki is a fairly classic MVC architecture, with strict separation of concerns. The model is the tiddler store, the view is a rendering tree (such as the one created from $:/core/ui/PageTemplate in startup.js), and the controller is the core code itself.

TiddlyWiki Hangouts

3 months ago

The TiddlyWiki community holds regular Google Hangouts, usually every Tuesday from 4pm to 6pm (UK time). They are announced in the TiddlyWiki Google group and on the TiddlyWiki Twitter account.

Past Hangouts are archived in this YouTube playlist:

TiddlyWiki in the Sky for TiddlyWeb

4 months ago

TiddlyWiki in the Sky for TiddlyWeb allows content to be synchronised between TiddlyWiki running in the browser and a TiddlyWeb (or TiddlySpace) server. Features include:

  • Lazy loading
  • Two way synchronisation between the browser and the server
    • Synchronising from the server is accomplished by polling (currently every 60 seconds)
  • Throttling so that rapidly changing tiddlers don't overwhelm the server

The implementation is somewhat experimental, and includes these limitations:

  • Only works with tiddlers written in TiddlyWiki version 5 WikiText. Tiddlers in the old syntax will be parsed as TiddlyWikiClassic syntax
  • New tiddlers are not saved to the server
  • No way to delete tiddlers

To try out TiddlyWiki in the Sky for TiddlyWeb:

  1. If necessary, create an account at http://tiddlyspace.com/
  2. Create a new space, eg <myspace>
  3. Include the space tw5tiddlyweb
  4. Visit http://<myspace>.tiddlyspace.com/tw5

TiddlyWiki on Firefox for Android Video

5 months ago

This brief screencast shows how to setup Firefox for Android so you can save changes to TiddlyWiki:

TiddlyWiki on node-webkit

5 months ago

node-webkit allows TiddlyWiki to be set up as a native application for Windows, Mac OS X or Linux.

Setting up

  1. Create a folder with the following contents:
    1. The appropriate copy of node-webkit for your platform, downloaded from https://github.com/rogerwang/node-webkit
    2. Your TiddlyWiki HTML file as index.html
    3. A file called package.json with the following content:

      {
          "name": "tiddlywiki",
          "main": "./index.html",
      	"window": {
      		"toolbar": true,
      		"width": 1024,
      		"height": 768
      	}
      }

  2. Run the node-webkit application
  3. Try saving changes in the usual way

Limitations

MP3 audio and H264 video are not supported without special steps described on the node-webkit wiki.

TiddlyWiki on Node.js

3 months ago

Running TiddlyWiki on Node.js brings several important benefits over and above the single file version:

  • You can edit your content on any suitably compatible HTML5 browser, including smartphones and tablets
  • Individual tiddlers are stored in separate files, which you can organise as you wish
  • The ability to build multiple wikis that blend different combinations of shared and unique content

Installation

  1. Install Node.js from http://nodejs.org
  2. Open a command line terminal and type:

    npm install -g tiddlywiki

    If it fails with an error you may need to re-run the command as an administrator:

    npm install -g tiddlywiki (Windows)

    sudo npm install -g tiddlywiki (Mac/Linux)

  3. Check TiddlyWiki is installed by typing:

    tiddlywiki --version

  4. In response, you should see TiddlyWiki report its current version (eg 5.0.8-beta; you may also see other debugging information reported)
  5. Try it out:
    1. tiddlywiki mynewwiki --init server to create a folder for a new wiki that includes server-related components
    2. tiddlywiki mynewwiki --server to start TiddlyWiki
    3. Visit http://127.0.0.1:8080/ in your browser
    4. Try editing and creating tiddlers

The -g flag causes TiddlyWiki to be installed globally. Without it, TiddlyWiki will only be available in the directory where you installed it.

A slightly different method for installation is recommended if you plan on forking the source code in order to study it or contribute to it. See Working with the TiddlyWiki5 repository.

Usage

TiddlyWiki5 can be used on the command line to perform an extensive set of operations based on TiddlyWikiFolders, TiddlerFiles and TiddlyWikiFiles.

For example, the following command loads the tiddlers from a TiddlyWiki HTML file and then saves one of them in static HTML:

tiddlywiki --verbose --load mywiki.html --rendertiddler ReadMe ./readme.html

Running tiddlywiki from the command line boots the TiddlyWiki kernel, loads the core plugins and establishes an empty wiki store. It then sequentially processes the command line arguments from left to right. The arguments are separated with spaces.

The first argument is the optional path to the TiddlyWikiFolder to be loaded. If not present, then the current directory is used.

The commands and their individual arguments follow, each command being identified by the prefix --.

tiddlywiki [<wikipath>] [--<command> [<arg>[,<arg>]]]

The available commands are:

See also:

Upgrading

If you've installed TiddlyWiki on Node.js on the usual way, when a new version is released you can upgrade it with this command:

npm update -g tiddlywiki

On Mac or Linux you'll need to add sudo like this:

sudo npm update -g tiddlywiki

TiddlyWiki2ReadMe

Building TiddlyWikiClassic

TiddlyWiki5 can be used to build older 2.x.x versions of TiddlyWikiClassic from their constituent components. Doing so involves these features:

  • The tiddlywiki/classictools plugin, containing a deserializer module which allows tiddlers to be loaded from TiddlyWiki 2.x.x .recipe files
  • The stripcomments format for the ViewWidget, which strips single line JavaScript comments starting //#
  • The stripTitlePrefix='yes' attribute of the FieldsWidget, which removes prefixes wrapped in curly braces from the title attribute
    • For example, {tiddler}HelloThere would be transformed to HelloThere

Usage

TiddlyWikiClassic is built from the command line by running TiddlyWiki on Node.js. A typical usage would be:

node ../../tiddlywiki.js \
	--verbose \
	--load <path_to_recipe_file> \
	--rendertiddler $:/core/templates/tiddlywiki2.template.html <path_to_write_index_file> text/plain \
	|| exit 1

TiddlyWiki5

9 months ago

TiddlyWiki5 is a reboot of TiddlyWiki for the next 25 years. It is a complete interactive wiki in JavaScript that can be run in the browser or on the server under Node.js.

TiddlyWiki5 Development Environment

9 months ago

This information is for people who are working on the development of TiddlyWiki5 itself, and isn't relevant for end users

Setting up npm

Installing TiddlyWiki5 with NPM downloads a snapshot release of TiddlyWIki5. To use a development copy of the TiddlyWiki5 repository instead of the copy installed by NPM, use this command within the root of the TiddlyWiki5 repo:

npm link

Bumping version numbers

As releases are made during development it is necessary to adjust the version number of the TiddlyWiki5 core. This is done with the npm version command. For example:

npm version 5.0.0-alpha.10

As described in #10 in this article by npm's author, when run from within a git repo this command will also commit the change and tag it

TiddlyWiki5 Versioning

6 months ago

Each release of TiddlyWiki5 is identified by a version number that complies with the Semantic Versioning 2.0.0 standard.

TiddlyWiki Core Version

According to the standard:

Given a version number MAJOR.MINOR.PATCH, increment the:

MAJOR version when you make incompatible API changes,
MINOR version when you add functionality in a backwards-compatible manner, and
PATCH version when you make backwards-compatible bug fixes.
Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.

Alpha and Beta versions

While in alpha TiddlyWiki5 uses the pre-release label "alpha", for example:

5.0.1-alpha

Each new alpha or beta release will bump the PATCH version number. This breaks the strict semantics of versioning because PATCH increments are supposed to be reserved for compatible changes.

Note that prior to 5.0.1-alpha, TiddlyWiki5 used version numbers formatted as 5.0.0-alpha.19. The change was made to enable the upgrade mechanism to recognise plugin updates from the version information.

Interim versions

During development when a new release is being prepared, the pre-release label is set to prerelease.

Plugin Versions

Version numbers

TiddlyWiki5 uses the version information attached to plugins for determining which of two plugins is more recent during an upgrade or import. The pre-release label is ignored when performing these comparisons.

TiddlyWikiClassic

5 months ago

"TiddlyWiki Classic" refers to versions prior to 5.0, when TiddlyWiki was completely rewritten from the ground up. TiddlyWiki Classic is still being maintained at:

http://classic.tiddlywiki.com/

MarioPietsch has started a site comparing the syntax and other changes between TiddlyWikiClassic and TiddlyWiki version 5:

http://compare-tw2-tw5.tiddlyspace.com

TiddlyWikiFolders

57 days ago

As well as traditional single file wikis, TiddlyWiki on Node.js supports wikis that are stored as a folder of individual tiddler files.

Wiki folder files and folders

Wiki folders can contain the following files and folders:

  • tiddlywiki.info - JSON file containing metadata for the wiki
  • \tiddlers - folder containing tiddler files comprising the wiki
  • \plugins - folder containing plugin folders to be included in the wiki

Only the tiddlywiki.info file is required, the tiddlers and plugins folders are optional. Any files and folders not listed above are ignored.

Content of tiddlywiki.info file

The tiddlywiki.info file in a wiki folder contains a JSON object comprising the following fields:

  • plugins - an array of plugin names to be included in the wiki
  • themes - an array of theme names to be included in the wiki
  • languages - an array of language names to be included in the wiki
  • includeWikis - an array of relative paths to external wiki folders to be included in the wiki
  • build - a hashmap of named build targets, each defined by an array of command tokens (see BuildCommand)
  • config - an optional hashmap of configuration options (see below)

Configuration options include:

  • retain-original-tiddler-path - If true, the server will generate a tiddler $:/config/OriginalTiddlerPaths containing the original file paths of each tiddler in the wiki

For example:

{
	"plugins": [
		"tiddlywiki/tiddlyweb",
		"tiddlywiki/filesystem"
	],
	"includeWikis": [
		"../tw5.com"
	],
	"build": {
		"index": [
			"--rendertiddler","$:/core/save/all","index.html","text/plain"],
		"favicon": [
			"--savetiddler","$:/favicon.ico","favicon.ico",
			"--savetiddler","$:/green_favicon.ico","static/favicon.ico"]
	},
	"config": {
		"retain-original-tiddler-path": true	
	}
}

Content of tiddlers folder

All the TiddlerFiles in the tiddlers folder are read into the wiki at startup. Sub-folders are scanned recursively for TiddlerFiles.

Sub-folders within the tiddlers folder can also be given a tiddlywiki.files JSON file that overrides the default processing for that folder. The file format is illustrated with this example from the D3 plugin:

{
	"tiddlers": [
		{
			"file": "d3.min.js",
			"fields": {
				"type": "application/javascript",
				"title": "$:/plugins/tiddlywiki/d3/d3.js",
				"module-type": "library"
			},
			"prefix": "var d3;if($tw.browser){\n",
			"suffix": "}\nexports.d3 = d3;\n"
		},
		{
			"file": "cloud/d3.layout.cloud.js",
			"fields": {
				"type": "application/javascript",
				"title": "$:/plugins/tiddlywiki/d3/d3.layout.cloud.js",
				"module-type": "library"
			}
		}
	]
}

The JSON data consists of an object with a tiddlers property that contains an array of information about each tiddler to be loaded into the wiki. That information consists of:

  • file: the relative or absolute path to the file to include
  • fields: an object containing fields that override any provided in the tiddler file
  • prefix & suffix: (optional) specify strings to be prefixed and suffixed to the tiddler file text content

tips

3 months ago

Hints and tips to help you get the most from TiddlyWiki.

TitlesPolicy

5 months ago

As the structures within your TiddlyWiki documents get more complex it can be hard to keep the titles of tiddlers consistent. For example, should terms be defined in the plural or the singular? Camel case or separate words?

Recording a formal titling policy can help to reduce confusion. For example, the titling policies for this wiki are:

Policies that may make sense for your own wikis include:

  • Use the prefix $:/_ for any system tiddlers that you create to ensure that they are near the top of the system tiddler listing in the sidebar

TranscludeWidget

28 days ago

Introduction

The TranscludeWidget dynamically imports content from another tiddler.

Attributes

AttributeDescription
tiddlerThe title of the tiddler to transclude (defaults to the current tiddler)
fieldThe field name of the current tiddler (defaults to "text"; if present takes precedence over the index attribute)
indexThe index of a property in a DataTiddler
modeOverride the default parsing mode for the transcluded text to "block" or "inline"

The TranscludeWidget treats any contained content as a fallback if the target of the transclusion is not defined (ie a missing tiddler or a missing field).

Parsing modes

TiddlyWiki parses text in two modes:

  • inline mode recognises character formatting such as emphasis, links
  • block mode recognises all the inline formatting, and adds block formatting such as tables, headings and lists

Usually, the mode is determined by whether the transclude widget itself has been parsed in block or inline mode. This can be overridden with the mode attribute.

For example, consider tiddler "A" with this content:

# Item one
#<$transclude tiddler="B"/>
# Item two

And a tiddler "B" with this content:

# Item one - a
# Item one - b

The result will be something like this:

  1. Item one
  2. # Item one - a # Item one - b
  3. Item two

This can be fixed by amending tiddler "A":

# Item one
#<$transclude tiddler="B" mode="block"/>
# Item two

Transclusion in WikiText

3 months ago

You can incorporate the content of one tiddler within another using the transclusion notation:

  • {{MyTiddler}} transcludes a single tiddler
  • {{MyTiddler||TemplateTitle}} displays the tiddler through a specified TemplateTiddler
  • {{||TemplateTitle}} displays the specified template tiddler without altering the current tiddler

You can also use a TextReference instead of a tiddler title:

  • {{MyTiddler!!field}} transcludes a specified field of a tiddler
  • {{!!field}} transcludes a specified field of the current tiddler
  • {{MyTiddler##index}} transcludes a specified indexed property of a DataTiddler
  • {{##index}} transcludes a specified indexed property of the current DataTiddler

A similar syntax can be used to transclude a list of tiddlers matching a specified TiddlerFilter:

{{{ [tag[mechanism]] }}}
{{{ [tag[mechanism]] ||TemplateTitle}}}

TranslationMechanism

4 months ago

The translation mechanism of TiddlyWiki manages and switches between language plugins that provide translations of the TiddlyWiki user interface. How to create a translation for TiddlyWiki explains how translators can create and submit translations for TiddlyWiki.

The title of the current language plugin is read from the tiddler $:/language. If the selected plugin changes then any displayed translateable text automatically changes.

Translation plugins are bundles of tiddlers that each contain an indepedent translatable string. The strings are transcluded as needed.

Translatable strings are generally in the namespace $:/language/, for example:

Typed Blocks in WikiText

5 months ago

WikiText can include blocks of text that are rendered with an explicit ContentType like this:

$$$image/svg+xml
<svg xmlns="http://www.w3.org/2000/svg" width="150" height="100">
  <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="green" />
</svg>
$$$

This renders as:

It is also possible to abbreviate the ContentType to a file extension. For example:

$$$.svg
<svg xmlns="http://www.w3.org/2000/svg" width="150" height="100">
  <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
</svg>
$$$

This renders as:

Unknown types render as plain text:

$$$text/unknown
Some plain text, which will not be //formatted//.
$$$

Which renders as:

Some plain text, which will not be //formatted//.

A render type can also be specified, causing a particular text rendering to be displayed. For example:

$$$text/vnd.tiddlywiki>text/html
This is ''some'' wikitext
$$$

$$$text/vnd.tiddlywiki>text/plain
This is ''some'' wikitext
$$$

Renders as:

<p>This is <strong>some</strong> wikitext</p>
This is some wikitext

Upgrading

2 months ago

There are several methods for upgrading an existing TiddlyWiki version 5 document to a new release. There is a different procedure for upgrading TiddlyWiki on Node.js.

Regardless of which method you use, remember the The First Rule of Using TiddlyWiki:

You are responsible for looking after your own data; take care to make backups, especially when upgrading the TiddlyWiki core

Upgrading from TiddlyWikiClassic

Remember that TiddlyWiki version 5 is not fully backwards compatible with the older TiddlyWikiClassic. It is recommended that users of TiddlyWikiClassic should not attempt to upgrade their existing files until the new version is more mature.

Online upgrading

This process will work on most desktop browsers. Note that none of your personal data leaves your browser with this process.

  1. Locate your TiddlyWiki file in the file system (ie using Windows Explorer, the Finder on Mac OS X, or your file manager on Linux)
  2. Visit http://tiddlywiki.com/empty.html in your browser
  3. Drag your old TiddlyWiki HTML file into the browser window
    • If the file is encrypted you will be prompted for the password
    • Your tiddlers should be imported
  4. Set a password if you want to use encryption
  5. Save changes to save the new version

This will download a file called empty.html to your computer. This file is the upgrade of your old file. You may need to open the location where empty.html was downloaded, rename empty.html with the name of the old file you are upgrading, and replace the old file by moving the new file in its place.

For the moment you'll also need to manually update any plugins that are not included in empty.html:

  1. Open the control panel to the Plugins tab in your upgraded wiki
  2. Check the version numbers of the plugins you are using; any plugins with an older version than the version of $:/core will probably need updating
  3. Locate a wiki with the plugins you need to update and open the control panel Plugins tab
  4. Drag the plugin links one by one back to your own wiki. You should see the version numbers update in the control panel
  5. Save your wiki

Offline upgrading

You can also download http://tiddlywiki.com/empty.html locally and perform the same drag-and-drop procedure to upgrade your files.

Problems with Upgrades

Particularly during the beta, it is possible for a customisation applied in a previous version to break when upgraded to the latest version. Use SafeMode to investigate and fix these problems.

Upgrading TiddlyWiki on Node.js

5 months ago

If you've installed TiddlyWiki on Node.js on the usual way, when a new version is released you can upgrade it with this command:

npm update -g tiddlywiki

On Mac or Linux you'll need to add sudo like this:

sudo npm update -g tiddlywiki

Using a custom path prefix with the client-server edition

10 days ago

By default, when running TiddlyWiki on Node.js, the server exposes the wiki at the URI formed from the protocol, host and port - for example, http://127.0.0.1:8080/.

There are two steps to running the wiki at a custom path like http://127.0.0.1:8080/path/to/my/wiki/:

  1. Configure the server by passing /path/to/my/wiki as the pathprefix argument of the ServerCommand
  2. Configure the client by creating a tiddler called $:/config/tiddlyweb/host that contains $protocol$//$host$/path/to/my/wiki/

Using Stylesheets

59 days ago

The usual way of modifying the appearance of a TiddlyWiki is to use one of the available themes, or to modify the colour palette.

You can also use custom CSS stylesheets by tagging tiddlers with $:/tags/stylesheet. For example, create a tiddler with the tag $:/tags/stylesheet and the following content in order to change the page background colour to red:

html body.tw-body {
	background: red;
}

Overriding Theme Settings

Note that custom stylesheets are applied independently to the theme stylesheets. This means that it is frequently necessary to use CSS specificity to reliably override settings within the theme. This means ensuring that the CSS rule in your custom stylesheet is more specific than the theme rule that you are overriding. "More specific" generally means using more CSS rules. So, html body.tw-body is more specific than body.tw-body.

Stylesheet Types

Usually it is best to use the type text/css for stylesheets. This treats them as plain stylesheets, and ensures that TiddlyWiki doesn't apply any wiki processing to them.

If you wish to use macros and transclusions in your stylesheets you should instead use the default WikiText type text/vnd.tiddlywiki. This allows full WikiText processing to be performed. Here is an example:

\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline

body.tw-body pre {
	<<box-shadow "inset 0 1px 0 #fff">>
}

The \rules pragma at the top of the tiddler restricts the WikiText to just allow macros and transclusion. This avoids mistakenly triggering unwanted WikiText processing.

Stylesheet Macros

Several globally available macros are provided that are helpful in constructing stylesheets. See $:/core/ui/PageStylesheet for the definitions of these macros.

  • <<colour name>> and <<color name>> retrieve named colours from the current colour palette
  • <<box-shadow shadow>> specify a box-shadow
  • <<filter filter>> specify a CSS filter
  • <<transition transition>> specify a CSS transition
  • <<transform-origin origin>> specify the CSS transform origin
  • <<background-linear-gradient gradient>> specify a linear gradient
  • <<datauri title>> retrieves the base64 content of a tiddler for use via the CSS url() operator

Using TiddlyWiki for GitHub Pages project documentation

9 months ago

TiddlyWiki5 can be used to produce documentation for GitHub projects. It lets you maintain a single set of documentation as a TiddlyWikiFolder containing separate tiddler files under source code control, and then use it to produce readme.md files for inclusion in project folders, or HTML files for storage in GitHub Pages. Both features are demonstrated by TiddlyWiki5 itself.

Generating readme.md files

When displaying the contents of a folder GitHub will look for a readme.md file and display it. Note that it will not display full HTML files in this way, just static MarkDown files (this is a security measure). Happily MarkDown permits a safe subset of HTML, and thus to generate a readme.md file that is suitable for GitHub it is just necessary for TiddlyWiki5 to generate the content of the <body> element of an HTML document, and give it the appropriate filename.

This is done in bld.sh by this command:

--rendertiddler ReadMe ./readme.md text/html

It saves the tiddler ReadMe to the file ./readme.md in the text/html format.

By default, tiddler links will be rendered as <a> links to a relative URI consisting of the title of the tiddler. This behaviour can be overridden by defining the macro tw-wikilink-template, as is done at the top of the tiddler ReadMe:

\define tw-wikilink-template() http://tiddlywiki.com/static/$uri_doubleencoded$.html

See the LinkWidget for more details.

In this example, tiddler links are rendered as links to the static rendering of tw5.com.

Publishing to GitHub Pages

Publishing to GitHub Pages is very straightforward. In the case of TiddlyWiki5, several different build products are published.

The bld.sh script deposits the build products directly into the local clone of the repo associated with the GitHub Pages account. There is then a manual step to review changes and push them up to github.com.

Using TiddlyWiki on Node.js

6 days ago

TiddlyWiki5 can be used on the command line to perform an extensive set of operations based on TiddlyWikiFolders, TiddlerFiles and TiddlyWikiFiles.

For example, the following command loads the tiddlers from a TiddlyWiki HTML file and then saves one of them in static HTML:

tiddlywiki --verbose --load mywiki.html --rendertiddler ReadMe ./readme.html

Running tiddlywiki from the command line boots the TiddlyWiki kernel, loads the core plugins and establishes an empty wiki store. It then sequentially processes the command line arguments from left to right. The arguments are separated with spaces.

The first argument is the optional path to the TiddlyWikiFolder to be loaded. If not present, then the current directory is used.

The commands and their individual arguments follow, each command being identified by the prefix --.

tiddlywiki [<wikipath>] [--<command> [<arg>[,<arg>]]]

The available commands are:

See also:

Using TiddlyWiki on TiddlyDesktop

4 months ago

TiddlyDesktop is an app for Windows, Mac OS X and Linux that lets you work with TiddlyWiki files.

  1. Install the latest release of TiddlyDesktop from https://github.com/Jermolene/TiddlyDesktop/releases
  2. Run TiddlyDesktop
  3. Use the browse button to open TiddlyWiki files
  4. Save changes within TiddlyWiki in the usual way

See the Introducing TiddlyDesktop Video

UsingSVG

6 months ago

TiddlyWiki5 allows you to use SVG to display vector graphics in two ways:

  • Tiddlers with the type image/svg+xml are interpreted as SVG images, and displayed and transcluded as self-contained <img> elements with the SVG embedded as a data URI in the src attribute.
  • WikiText can also include inline SVG elements directly. See below for an example.

Embedding SVG tiddlers

You can embed an SVG image tiddler using the ordinary transclusion syntax:

{{Motovun Jack.jpg}}

You can also use TypedBlockWikiText to embed an inline SVG tiddler.

The implications of the image being rendered within an <img> element are that it is sandboxed; it can't use CSS styles from the parent document, for example. Neither can the image use WikiText features like transclusion.

Embedding SVG elements

The other way to use SVG is to embed the <svg> element directly. For example:

Note that inline SVG elements don't need an <?xml version="1.0"?> directive.

Including HTML or WikiText content in SVG images

You can include simple text strings in SVG images using the <text> element:

Hello, out there

HTML or WikiText content can be included within inline SVG images using the <foreignObject> element. For example:

Here is some text that requires a word wrap, and includes a link to a tiddler.

Transcluding SVG elements

When embedding SVG elements you can also use WikiText features like transclusion. For example, here is an SVG circle with the radius set to the value in the tiddler $:/SVGExampleRadius:

You can edit the value of the radius here:

VerboseCommand

Triggers verbose output, useful for debugging

--verbose

VersionCommand

Displays the version number of TiddlyWiki.

--version

VersionMacro

5 months ago

The version macro returns the current TiddlyWiki version number.

Example

The version macro takes no parameters:

Version number: <<version>>

Version number: 5.0.13-beta

video

3 months ago

Video Tutorials

4 months ago

The aim is to curate a series of videos to guide people through getting up and running with TiddlyWiki. Contributions are welcome.

Getting Started

This brief tutorial takes you through the basics of saving changes with a standalone TiddlyWiki5 file.

Using TiddlyWiki on Firefox for Android

This brief screencast shows how to setup Firefox for Android so you can save changes to TiddlyWiki:

Introduction to TiddlyDesktop

This brief introduction shows how to install and use TiddlyDesktop:

OXTWIG

This video of the second OXTWIG meeting starts with a tutorial overview demonstrating how to use TiddlyWiki in different scenarios:

ViewWidget

4 months ago

Introduction

The view widget displays the contents of a tiddler field in a specified format.

Content and Attributes

The content of the <$view> widget is displayed if the field or property is missing or empty.

AttributeDescription
tiddlerThe title of the tiddler (defaults to the WidgetVariable: currentTiddler)
fieldThe name of the field to view (defaults to "text")
indexThe name of the index to view
formatThe format for displaying the field (see below)
templateThe optional template used with certain formats

Formats

The following formats can be specified in the format attribute:

FormatDescription
textPlain text
htmlwikifiedThe field is wikified and the resulting HTML returned as plain text
htmlencodedThe field is displayed with HTML encoding issues
dateThe field is interpreted as a UTC date and displayed according to the DateFormat specified in the template attribute
relativedateThe field is interpreted as a UTC date and displayed as the interval from the present instant
stripcommentsThe field is interpreted as JavaScript source code and any lines beginning \\# are stripped
jsencodedThe field is displayed as a JavaScript encoded string

widget

3 months ago

Widgets add dynamic functionality to WikiText.

WidgetMessage: tw-cancel-tiddler

3 months ago

The tw-cancel-tiddler message abandons the changes in a draft tiddler. It requires the following properties on the event object:

NameDescription
paramTitle of the tiddler that is being cancelled out of edit mode
tiddlerTitleFallback title that is used if param isn't specified (automatically set by the ButtonWidget)

The cancel tiddler message is usually generated with the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-clear-password

3 months ago

The tw-clear-password message clears the current password from the password vault, clearing the $:/isEncrypted tiddler. See EncryptionMechanism for details.

This message is typically generated with the ButtonWidget, and is handled by the core itself.

WidgetMessage: tw-close-all-tiddlers

3 months ago

The close all tiddlers message empties the story list.

The close all tiddlers message is usually generated with the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-close-other-tiddlers

3 months ago

The tw-close-other-tiddlers message removes all but a specified tiddler from the story list. It requires the following properties on the event object:

NameDescription
paramTitle of the tiddler that is not to be closed
tiddlerTitleFallback title that is used if param isn't specified (automatically set by the ButtonWidget)

The close other tiddlers message is usually generated with the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-close-tiddler

3 months ago

The tw-close-tiddler message removes a specified tiddler from the story list. It requires the following properties on the event object:

NameDescription
paramTitle of the tiddler that is to be closed
tiddlerTitleFallback title that is used if param isn't specified (automatically set by the ButtonWidget)

The close tiddler message is usually generated with the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-delete-tiddler

3 months ago

The tw-delete-tiddler message deletes the specified tiddler and removes it from the current story. If the tiddler is a draft then it also deletes the tiddler specified in the draft.of field. The delete tiddler message requires the following properties on the event object:

NameDescription
paramTitle of the tiddler that is to be deleted
tiddlerTitleFallback title that is used if param isn't specified (automatically set by the ButtonWidget)

The delete tiddler message is usually generated with the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-edit-tiddler

3 months ago

The tw-edit-tiddler message replaces the specified tiddler in the current story with a draft version of itself. It requires the following properties on the event object:

NameDescription
paramTitle of the tiddler that is being switched to edit mode
tiddlerTitleFallback title that is used if param isn't specified (automatically set by the ButtonWidget)

The edit tiddler message is usually generated with the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-home

3 months ago

The tw-home message resets the story list to the tiddlers defined in $:/DefaultTiddlers. It does not require any properties on the event object.

The cancel tiddler message is usually generated with the ButtonWidget and is handled by the core.

WidgetMessage: tw-import-tiddlers

3 months ago

The tw-import-tiddlers message inserts a list of tiddlers into the store. If multiple tiddlers are imported then a report is displayed; if only one tiddler is imported then it is displayed instead. The import message requires the following properties on the event object:

NameDescription
paramJSON text of the array of tiddlers to be imported

This message is handled by the NavigatorWidget.

The import tiddlers message is usually generated with the DropzoneWidget or the BrowseWidget, and is handled by the NavigatorWidget.

WidgetMessage: tw-navigate

3 months ago

The tw-navigate message inserts the specified tiddler into the story and puts it at the top of the history stack. If the tiddler is not already present in the story then it will be positioned immediately after the tiddler specified in event.navigateFromTitle.

The navigate message requires the following properties on the event object:

NameDescription
navigateToTitle of the tiddler that is being navigated
navigateFromTitleTitle of the tiddler from which the navigation was initiated
navigateFromClientRectBounding rectangle in client page coordinates of the element initiating the navigation
navigateSuppressNavigationtrue causes the new tiddler to only be added to the story, and not the history stack. This suppresses the scrolling associated with navigating to a tiddler

The navigate message can be generated by the LinkWidget and the ButtonWidget, and is handled by the NavigatorWidget.

WidgetMessage: tw-new-tiddler

3 months ago

The new tiddler message creates a new draft tiddler and adds it to the current story. It requires the following properties on the event object:

NameDescription
paramOptional title of a tiddler to use as a template for the new tiddler
navigateFromTitleTitle of the tiddler from which the navigation to the new tiddler was initiated

The new tiddler message is usually generated with the LinkWidget or the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-save-tiddler

3 months ago

The tw-save-tiddler message is applied to draft tiddlers. It saves the draft over the tiddler identified in the draft.of field and then deletes the draft. The save tiddler message requires the following properties on the event object:

NameDescription
paramTitle of the tiddler that is being switched out of edit mode
tiddlerTitleFallback title that is used if param isn't specified (automatically set by the ButtonWidget)

The save tiddler message is usually generated with the ButtonWidget and is handled by the NavigatorWidget.

WidgetMessage: tw-set-password

3 months ago

The tw-set-password message prompts the user for a new password and stores it in the password vault, replacing any existing password. It also sets the $:/isEncrypted tiddler. See EncryptionMechanism for details.

This message is typically generated with the ButtonWidget, and is handled by the core itself.

WidgetMessages

3 months ago

WidgetModules

7 months ago

Introduction

Widget modules are used as part of the RenderingMechanism to implement each type of renderable entity. As well as the widgets that are familiar to end users, the following primitives are also implemented as widgets:

  • HTML text nodes
  • HTML element nodes
  • HTML entities

All widgets inherit from a base widget class that is defined in $:/core/modules/widgets/widget.js.

Widget Properties

The following widget properties are defined by the core. The lifecycle of a widget object is largely a matter of maintaining the consistency of these internal properties in the face of external state changes. Individual widgets usually add their own additional properties too.

NameDescription
parseTreeNodeReference to the parse tree node corresponding to this widget
wikiReference to the Wiki object associated with this widget
variablesHashmap of information about each widget variable (see below)
parentWidgetReference to the parent widget
documentReference to the document object associated with this widget. Usually either the browser global document variable or a reference to the FakeDomMechanism's $tw.fakeDocument
attributesHashmap of information about each attribute attached to this widget (see below)
childrenArray of child widgets
domNodesFor widgets that directly generate DOM nodes, an array of the generated nodes
eventListenersArray of event listener definitions

Widget Variables

The widget variables defined on a widget are stored in a hashmap of the variable name. The hashmap contains:

  • name: name of variable
  • params: array of parameters for macro definitions, each {name: "<name>", default: "<optionaldefault>"}
  • value: string value of variable

Widget Attributes

The widget attributes associated with a widget are stored in a hashmap of the attribute name. The hashmap contains an object that describes the attribute value. Currently three attribute value types are supported:

  • Strings: {type: "string", value: "<value>"}
  • Tiddler text reference indirection: {type: "indirect", textReference: "<textref>"}
  • Macro invocation: {type: "macro", value: {name: "<macroname>", params: [{name: "<paramname>", value: "<paramvalue>"}, ... ]}

Widget Event Listeners

The event listeners attached to a widget are stored as a hashmap by event type. Each value is a handler function that accepts a single event parameter.

Widget methods

The individual methods defined by the widget object are documented in the source code of $:/core/modules/widgets/widget.js. Here we give an overview of the overall lifecycle, and how the methods fit together

Widget initialise method

Widget widgetClasses method

Widget render method

Widget execute method

Widget getVariable method

Widget substituteVariableParameters method

Widget substituteVariableReferences method

Widget evaluateMacroModule method

Widget setVariable method

Widget hasVariable method

Widget getStateQualifier method

Widget computeAttributes method

Widget hasAttribute method

Widget getAttribute method

Widget assignAttributes method

Widget makeChildWidgets method

Widget makeChildWidget method

Widget renderChildren method

Widget addEventListeners method

Widget addEventListener method

Widget dispatchEvent method

Widget refresh method

Widget refreshSelf method

Widget refreshChildren method

Widget findNextSiblingDomNode method

Widget findFirstDomNode method

Widget removeChildDomNodes method

Widgets in WikiText

4 days ago

Widgets provide rich functionality within WikiText. They have the same syntax as HTML elements, but the tag name always starts with $. For example:

<$button message="tw-close-tiddler">Close Me!</$button>

Note that widgets inherit all the features of HTML in WikiText:

  • Widget attributes can be specified as:
    • Unquoted strings (that cannot contain spaces)
    • Strings quoted with single or double quotes
    • Strings quoted with triple-double quotes
    • Macro invocations (eg attr=<<myMacro>>)
    • Transclusions (eg, attr={{MyTiddler!!field}})
  • The content of a widget is parsed in inline mode unless the opening tag is followed by two linebreaks, which forces block mode
    • 'Inline mode' means that 'block mode' parse rules like headings, tables and lists are not recognised

See HTML in WikiText for more details.

The available widgets include:

BrowseWidget
ButtonWidget
CheckboxWidget
CountWidget
DropzoneWidget
EditBitmapWidget
EditTextWidget
EditWidget
EncryptWidget
FieldManglerWidget
FieldsWidget
GridWidget
ImageWidget
ImportVariablesWidget
KeyboardWidget
LinkCatcherWidget
LinkWidget
ListWidget
MacroCallWidget
NavigatorWidget
PasswordWidget
RadioWidget
RevealWidget
ScrollableWidget
SelectWidget
SetVariableWidget
SetWidget
TextWidget
TiddlerWidget
TranscludeWidget
ViewWidget

Wiki

Groups of uniquely titled tiddlers are contained in WikiStore objects.

The WikiStore also manages the plugin modules used for widgets, and operations like serializing, deserializing, parsing and rendering tiddlers.

WikiRuleModules

7 months ago

WikiRuleModules cover the module types wikirunrule, wikiblockrule and wikipragmarule. Modules of these types encapsulate the logic of individual parsing rules used by the WikiParser engine. For example, there is a wikirunrule module that identifies references to HTML entities by matching the pattern &<chars>;.

Pragma rules are applied at the start of a block of text, and cover definitions and declarations that affect the parsing of the rest of the text. Block rules are only applied at the beginning of a block of wikitext, while run rules can appear anywhere. The only current example of a pragma rule is for macro definitions.

Examples of block rules:

  • Headings
  • Tables
  • Lists

Examples of run rules:

  • Entities
  • HTML tags
  • Wiki links

Parser rule modules extend the $tw.WikiParserRule class. This is done by instantiating the class and then copying the exports of the rule module onto the instance. In this way, the parser rule can override the base behaviour of the $tw.WikiParserRule class. In particular, the base class incorporates logic for using regular expressions to match parse rules but this logic could be overridden by a parse rule that wanted to, say, use indexOf() instead of regular expressions.

The standard methods and properties of parser rules are as follows:

  • name: a string containing the name of this parse rule
  • init(parser): initialisation function called immediately after the constructor with a pointer back to the parser containing this rule
  • findNextMatch(pos): returns the position of the next match after the specified position
  • parse(): parses the most recent match, returning an array of the generated parse tree nodes. Pragma rules don't return parse tree nodes but instead modify the parser object directly (for example, to add local macro definitions)

The built in parser rules use regular expression matching. Such rules can take advantage of the implementation of findNextMatch() in the base $tw.WikiRule class by ensuring that their init() method creates a matchRegExp property containing the regular expression to match. The match property contains the details of the match for use in the parse() method.

WikiText

4 months ago

WikiText is a concise, expressive way of typing a wide range of text formatting, hypertext and interactive features. It allows you to focus on writing without a complex user interface getting in the way. It is designed to be familiar for users of MarkDown, but with more of a focus on linking and the interactive features.

Block Quotes in WikiText
Code Blocks in WikiText
Dashes in WikiText
Definitions in WikiText
Formatting in WikiText
Hard Linebreaks in WikiText
Headings in WikiText
Horizontal Rules in WikiText
HTML in WikiText
Images in WikiText
Linking in WikiText
Lists in WikiText
Macros in WikiText
Paragraphs in WikiText
Styles and Classes in WikiText
Tables in WikiText
Transclusion in WikiText
Typed Blocks in WikiText
Widgets in WikiText

Windows HTA Hack

6 months ago

Under Windows it is possible to convert TiddlyWiki into a true local application by renaming the HTML file to have the extension *.hta. The fsosaver module can then use the ActiveX FileSystemObject to save changes.

Note that one disadvantage of this approach is that the TiddlyWiki file is saved in UTF-16 format, making it up to twice as large as it would be with the usual UTF-8 encoding. However, opening and saving the file via another saving method will re-encode the file to UTF-8.

See Wikipedia for more details: http://en.wikipedia.org/wiki/HTML_Application

Working with the TiddlyWiki5 repository

5 months ago

Setting Up

If you plan on working with the TiddlyWiki5 source code then follow these steps:

  1. Fork the TiddlyWiki5 GitHub repository from https://github.com/Jermolene/TiddlyWiki5
  2. Clone a local copy of your fork
  3. Open a command line terminal and change the current working directory to the root of the repo
  4. Type npm link (Windows) or sudo npm link (Mac/Linux) to tell npm to use this copy of the repo as the globally installed one

After this procedure you can work with TiddlyWiki5 via npm as though it were installed in the usual way with npm install -g tiddlywiki.

See also Scripts for TiddlyWiki on Node.js.